← Back to Editor

#DFD3B9 · #B6AF93 · #96A183 · #5C7999 · #99C0BD

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#DFD3B9

Goose Yellow · Wheat · Lemon Cream

HEX
#DFD3B9
RGB
rgb(223, 211, 185)
HSL
hsl(41, 37%, 80%)
HSB
hsb(41, 17%, 87%)
CMYK
cmyk(0%, 5%, 17%, 13%)
Oklch
oklch(87.0% 0.037 86.2)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#B6AF93

Ginger · DarkGray · Sunflower

HEX
#B6AF93
RGB
rgb(182, 175, 147)
HSL
hsl(48, 19%, 65%)
HSB
hsb(48, 19%, 71%)
CMYK
cmyk(0%, 4%, 19%, 29%)
Oklch
oklch(75.2% 0.039 95.6)

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

#96A183

Grass Green · DarkSeaGreen · Olive Green

HEX
#96A183
RGB
rgb(150, 161, 131)
HSL
hsl(82, 14%, 57%)
HSB
hsb(82, 19%, 63%)
CMYK
cmyk(7%, 0%, 19%, 37%)
Oklch
oklch(69.2% 0.044 123.9)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#5C7999

Indigo · SlateGray · Navy Blue

HEX
#5C7999
RGB
rgb(92, 121, 153)
HSL
hsl(211, 25%, 48%)
HSB
hsb(211, 40%, 60%)
CMYK
cmyk(40%, 21%, 0%, 40%)
Oklch
oklch(56.6% 0.060 251.4)

Traditional「Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#99C0BD

Jade · DarkGray · Lake Green

HEX
#99C0BD
RGB
rgb(153, 192, 189)
HSL
hsl(175, 24%, 68%)
HSB
hsb(175, 20%, 75%)
CMYK
cmyk(20%, 0%, 2%, 25%)
Oklch
oklch(77.9% 0.042 190.5)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DFD3B9
B9C5DF

Analogous

DFC0B9
DFD3B9
D8DFB9

Triadic

DFD3B9
B9DFD3
D3B9DF

Split-Comp.

DFD3B9
B9D8DF
C0B9DF

Tetradic

DFD3B9
B9DFC0
B9C5DF
DFB9D8

Contrast Matrix WCAG 2.1 Contrast

DFD3B9
B6AF93
96A183
5C7999
99C0BD
—
1.5
Fail
1.8
Fail
3.0
AA Large
1.3
Fail
1.5
Fail
—
1.2
Fail
2.1
Fail
1.1
Fail
1.8
Fail
1.2
Fail
—
1.7
Fail
1.4
Fail
3.0
AA Large
2.1
Fail
1.7
Fail
—
2.3
Fail
1.3
Fail
1.1
Fail
1.4
Fail
2.3
Fail
—
White BG
1.5Fail
2.2Fail
2.7Fail
4.5AA
2.0Fail
Black BG
14.2AAA
9.5AAA
7.7AAA
4.6AA
10.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DADABF
B3B39A
9B9B8A
696991
AAAABE

Deuteranopia

DBDBC1
B3B49B
9A998C
67658F
A8A5BE

Tritanopia

DEC4C5
B69FA0
979091
5D8B8A
9BBEBE

Achromatopsia

D4D4D4
AEAEAE
9A9A9A
747474
B4B4B4

Shades & Tints Shades & Tints

#DFD3B9

Dark
Light

#B6AF93

Dark
Light

#96A183

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dfd3b9;
  --color-2: #b6af93;
  --color-3: #96a183;
  --color-4: #5c7999;
  --color-5: #99c0bd;
}

SCSS

$color-1: #dfd3b9;
$color-2: #b6af93;
$color-3: #96a183;
$color-4: #5c7999;
$color-5: #99c0bd;

TAILWIND

colors: {
  'brand-1': '#dfd3b9',
  'brand-2': '#b6af93',
  'brand-3': '#96a183',
  'brand-4': '#5c7999',
  'brand-5': '#99c0bd',
}

RGB Array

[223, 211, 185], [182, 175, 147], [150, 161, 131], [92, 121, 153], [153, 192, 189]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DFD3B9, #B6AF93, #96A183, #5C7999, #99C0BD is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #dfd3b9; --color-2: #b6af93; --color-3: #96a183; --color-4: #5c7999; --color-5: #99c0bd. 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. Restrained colors convey professionalism and trust. 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