#D5D0CA + #ECD5C3 + #CFAA4C + #F5CAAC + #988E74 · dark - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D5D0CA

Goose Yellow · LightGray · Peach Orange

HEX

#D5D0CA

RGB

rgb(213, 208, 202)

HSL

hsl(33, 12%, 81%)

HSB

hsb(33, 5%, 84%)

CMYK

cmyk(0%, 2%, 5%, 16%)

Oklch

oklch(86.0% 0.010 72.6)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#ECD5C3

Apricot · Wheat · Peach Orange

HEX

#ECD5C3

RGB

rgb(236, 213, 195)

HSL

hsl(26, 52%, 85%)

HSB

hsb(26, 17%, 93%)

CMYK

cmyk(0%, 10%, 17%, 7%)

Oklch

oklch(88.7% 0.035 60.4)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#CFAA4C

Ginger · SandyBrown · Sunflower

HEX

#CFAA4C

RGB

rgb(207, 170, 76)

HSL

hsl(43, 58%, 55%)

HSB

hsb(43, 63%, 81%)

CMYK

cmyk(0%, 18%, 63%, 19%)

Oklch

oklch(75.3% 0.120 87.6)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#F5CAAC

Apricot · Wheat · Peach Orange

HEX

#F5CAAC

RGB

rgb(245, 202, 172)

HSL

hsl(25, 78%, 82%)

HSB

hsb(25, 30%, 96%)

CMYK

cmyk(0%, 18%, 30%, 4%)

Oklch

oklch(86.9% 0.063 56.7)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#988E74

Ginger · Gray · Sunflower

HEX

#988E74

RGB

rgb(152, 142, 116)

HSL

hsl(43, 15%, 53%)

HSB

hsb(43, 24%, 60%)

CMYK

cmyk(0%, 7%, 24%, 40%)

Oklch

oklch(64.8% 0.039 89.5)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D5D0CA

C9CED4

Analogous

D4C9C9

D5D0CA

D4D4C9

Triadic

D5D0CA

C9D4CF

CFC9D4

Split-Comp.

D5D0CA

C9D4D4

C9C9D4

Tetradic

D5D0CA

C9D4C9

C9CED4

D4C9D4

Contrast Matrix WCAG 2.1 Contrast

D5D0CA	ECD5C3	CFAA4C	F5CAAC	988E74
—	1.1 Fail	1.4 Fail	1.0 Fail	2.1 Fail
1.1 Fail	—	1.6 Fail	1.1 Fail	2.3 Fail
1.4 Fail	1.6 Fail	—	1.5 Fail	1.5 Fail
1.0 Fail	1.1 Fail	1.5 Fail	—	2.2 Fail
2.1 Fail	2.3 Fail	1.5 Fail	2.2 Fail	—

White BG

1.5Fail

1.4Fail

2.2Fail

1.5Fail

3.3AA Large

Black BG

13.7AAA

14.9AAA

9.5AAA

13.9AAA

6.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D3D3CB

E2E2C7

BFBF63

E2E2B3

94947A

Deuteranopia

D3D4CC

E3E5C8

C1C468

E5E8B5

94957C

Tritanopia

D5CDCD

EBCBCC

CD7579

F3B9BA

987F80

Achromatopsia

D1D1D1

DADADA

AAAAAA

D3D3D3

8E8E8E

Shades & Tints Shades & Tints

#D5D0CA

Dark

Light

#ECD5C3

Dark

Light

#CFAA4C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d5d0ca;
  --color-2: #ecd5c3;
  --color-3: #cfaa4c;
  --color-4: #f5caac;
  --color-5: #988e74;
}

SCSS

$color-1: #d5d0ca;
$color-2: #ecd5c3;
$color-3: #cfaa4c;
$color-4: #f5caac;
$color-5: #988e74;

TAILWIND

colors: {
  'brand-1': '#d5d0ca',
  'brand-2': '#ecd5c3',
  'brand-3': '#cfaa4c',
  'brand-4': '#f5caac',
  'brand-5': '#988e74',
}

RGB Array

[213, 208, 202], [236, 213, 195], [207, 170, 76], [245, 202, 172], [152, 142, 116]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #D5D0CA, #ECD5C3, #CFAA4C, #F5CAAC, #988E74 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: #d5d0ca; --color-2: #ecd5c3; --color-3: #cfaa4c; --color-4: #f5caac; --color-5: #988e74. 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 dark-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