#D6BE6F + #DBC197 + #D4C4C1 + #C0C0CF + #A9B8D6 · earth - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D6BE6F

Ginger · BurlyWood · Sunflower

HEX

#D6BE6F

RGB

rgb(214, 190, 111)

HSL

hsl(46, 56%, 64%)

HSB

hsb(46, 48%, 84%)

CMYK

cmyk(0%, 11%, 48%, 16%)

Oklch

oklch(80.5% 0.103 93.0)

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

#DBC197

Goose Yellow · BurlyWood · Warm Sun

HEX

#DBC197

RGB

rgb(219, 193, 151)

HSL

hsl(37, 49%, 73%)

HSB

hsb(37, 31%, 86%)

CMYK

cmyk(0%, 12%, 31%, 14%)

Oklch

oklch(82.3% 0.063 79.6)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#D4C4C1

Peach Pink · Silver · Coral Red

HEX

#D4C4C1

RGB

rgb(212, 196, 193)

HSL

hsl(9, 18%, 79%)

HSB

hsb(9, 9%, 83%)

CMYK

cmyk(0%, 8%, 9%, 17%)

Oklch

oklch(83.3% 0.019 30.3)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#C0C0CF

Wisteria · Silver · Cobalt Blue

HEX

#C0C0CF

RGB

rgb(192, 192, 207)

HSL

hsl(240, 14%, 78%)

HSB

hsb(240, 7%, 81%)

CMYK

cmyk(7%, 7%, 0%, 19%)

Oklch

oklch(81.2% 0.021 285.9)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

#A9B8D6

Azure · LightSteelBlue · Cobalt Blue

HEX

#A9B8D6

RGB

rgb(169, 184, 214)

HSL

hsl(220, 35%, 75%)

HSB

hsb(220, 21%, 84%)

CMYK

cmyk(21%, 14%, 0%, 16%)

Oklch

oklch(78.1% 0.046 264.3)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D6BE6F

7088D7

Analogous

D78B70

D6BE6F

BBD770

Triadic

D6BE6F

70D7BF

BF70D7

Split-Comp.

D6BE6F

70BBD7

8B70D7

Tetradic

D6BE6F

70D78B

7088D7

D770BB

Contrast Matrix WCAG 2.1 Contrast

D6BE6F	DBC197	D4C4C1	C0C0CF	A9B8D6
—	1.1 Fail	1.1 Fail	1.0 Fail	1.1 Fail
1.1 Fail	—	1.0 Fail	1.0 Fail	1.1 Fail
1.1 Fail	1.0 Fail	—	1.1 Fail	1.2 Fail
1.0 Fail	1.0 Fail	1.1 Fail	—	1.1 Fail
1.1 Fail	1.1 Fail	1.2 Fail	1.1 Fail	—

White BG

1.8Fail

1.7Fail

1.8Fail

2.0Fail

Black BG

11.5AAA

12.1AAA

12.5AAA

11.7AAA

10.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CCCB82

D0D0A1

CDCDC2

C0C0CB

AFB0CF

Deuteranopia

CDCF87

D1D3A4

CECFC2

C0C0CA

AFAECD

Tritanopia

D59195

DAA9AB

D3C2C2

C0C9C8

AAC9C8

Achromatopsia

BCBCBC

C4C4C4

C8C8C8

C2C2C2

B7B7B7

Shades & Tints Shades & Tints

#D6BE6F

Dark

Light

#DBC197

Dark

Light

#D4C4C1

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d6be6f;
  --color-2: #dbc197;
  --color-3: #d4c4c1;
  --color-4: #c0c0cf;
  --color-5: #a9b8d6;
}

SCSS

$color-1: #d6be6f;
$color-2: #dbc197;
$color-3: #d4c4c1;
$color-4: #c0c0cf;
$color-5: #a9b8d6;

TAILWIND

colors: {
  'brand-1': '#d6be6f',
  'brand-2': '#dbc197',
  'brand-3': '#d4c4c1',
  'brand-4': '#c0c0cf',
  'brand-5': '#a9b8d6',
}

RGB Array

[214, 190, 111], [219, 193, 151], [212, 196, 193], [192, 192, 207], [169, 184, 214]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #D6BE6F, #DBC197, #D4C4C1, #C0C0CF, #A9B8D6 is ideal for: health products, baby brands, fresh-style blogs. 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: #d6be6f; --color-2: #dbc197; --color-3: #d4c4c1; --color-4: #c0c0cf; --color-5: #a9b8d6. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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 earth-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