← Back to Editor

#D0B16D · #CFB996 · #94B6A0 · #929080 · #D79099

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#D0B16D

Ginger · BurlyWood · Sunflower

HEX
#D0B16D
RGB
rgb(208, 177, 109)
HSL
hsl(41, 51%, 62%)
HSB
hsb(41, 48%, 82%)
CMYK
cmyk(0%, 15%, 48%, 18%)
Oklch
oklch(77.3% 0.094 85.8)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#CFB996

Ginger · Tan · Warm Sun

HEX
#CFB996
RGB
rgb(207, 185, 150)
HSL
hsl(37, 37%, 70%)
HSB
hsb(37, 28%, 81%)
CMYK
cmyk(0%, 11%, 28%, 19%)
Oklch
oklch(79.6% 0.053 79.3)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#94B6A0

Celadon · DarkSeaGreen · Apple Green

HEX
#94B6A0
RGB
rgb(148, 182, 160)
HSL
hsl(141, 19%, 65%)
HSB
hsb(141, 19%, 71%)
CMYK
cmyk(19%, 0%, 12%, 29%)
Oklch
oklch(74.5% 0.049 156.7)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#929080

Autumn Sage · Gray · Warm Gray

HEX
#929080
RGB
rgb(146, 144, 128)
HSL
hsl(53, 8%, 54%)
HSB
hsb(53, 12%, 57%)
CMYK
cmyk(0%, 1%, 12%, 43%)
Oklch
oklch(65.0% 0.023 101.2)

Traditional「Autumn Sage」· Paint「Warm Gray」· Creative Urban Concrete

#D79099

Peach Pink · DarkSalmon · Coral Red

HEX
#D79099
RGB
rgb(215, 144, 153)
HSL
hsl(352, 47%, 70%)
HSB
hsb(352, 33%, 84%)
CMYK
cmyk(0%, 33%, 29%, 16%)
Oklch
oklch(72.7% 0.087 11.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D0B16D
6D8CD0

Analogous

D07F6D
D0B16D
BDD06D

Triadic

D0B16D
6DD0B0
B06DD0

Split-Comp.

D0B16D
6DBDD0
7F6DD0

Tetradic

D0B16D
6DD07F
6D8CD0
D06DBD

Contrast Matrix WCAG 2.1 Contrast

D0B16D
CFB996
94B6A0
929080
D79099
—
1.1
Fail
1.1
Fail
1.6
Fail
1.2
Fail
1.1
Fail
—
1.2
Fail
1.7
Fail
1.3
Fail
1.1
Fail
1.2
Fail
—
1.4
Fail
1.1
Fail
1.6
Fail
1.7
Fail
1.4
Fail
—
1.3
Fail
1.2
Fail
1.3
Fail
1.1
Fail
1.3
Fail
—
White BG
2.1Fail
1.9Fail
2.2Fail
3.2AA Large
2.5Fail
Black BG
10.2AAA
11.0AAA
9.5AAA
6.5AA
8.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C3C27D
C5C59E
A3A3A5
919184
B8B897

Deuteranopia

C4C781
C7C8A1
A19EA7
919185
BCC296

Tritanopia

CE8A8D
CEA5A7
96AAAA
928788
D39595

Achromatopsia

B3B3B3
BCBCBC
A9A9A9
8F8F8F
A6A6A6

Shades & Tints Shades & Tints

#D0B16D

Dark
Light

#CFB996

Dark
Light

#94B6A0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d0b16d;
  --color-2: #cfb996;
  --color-3: #94b6a0;
  --color-4: #929080;
  --color-5: #d79099;
}

SCSS

$color-1: #d0b16d;
$color-2: #cfb996;
$color-3: #94b6a0;
$color-4: #929080;
$color-5: #d79099;

TAILWIND

colors: {
  'brand-1': '#d0b16d',
  'brand-2': '#cfb996',
  'brand-3': '#94b6a0',
  'brand-4': '#929080',
  'brand-5': '#d79099',
}

RGB Array

[208, 177, 109], [207, 185, 150], [148, 182, 160], [146, 144, 128], [215, 144, 153]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D0B16D, #CFB996, #94B6A0, #929080, #D79099 is ideal for: corporate websites, product showcases, portfolios. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #d0b16d; --color-2: #cfb996; --color-3: #94b6a0; --color-4: #929080; --color-5: #d79099. LangColor editor supports one-click export to CSS, SCSS, Tailwind, JSON and more. Click the "Export" button to choose your format.

What UI/UX design tips apply to this palette?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. Use the "Contrast Matrix" tool in LangColor editor to check WCAG accessibility levels for every color pair.

Which industries or brands suit this palette?

This general-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. Click "AI Analysis" in the editor for more detailed brand color suggestions.

🎨 Open this palette in Editor →

Generated by LangColor online color tool · Breaking the barrier between language and color