#CAE3DD + #D6C7BC + #E3C3AA + #E6D7C2 + #E8E9DB - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#CAE3DD

Jade · LightGray · Glacier Blue

HEX

#CAE3DD

RGB

rgb(202, 227, 221)

HSL

hsl(166, 31%, 84%)

HSB

hsb(166, 11%, 89%)

CMYK

cmyk(11%, 0%, 3%, 11%)

Oklch

oklch(89.6% 0.028 179.6)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#D6C7BC

Apricot · Silver · Peach Orange

HEX

#D6C7BC

RGB

rgb(214, 199, 188)

HSL

hsl(25, 24%, 79%)

HSB

hsb(25, 12%, 84%)

CMYK

cmyk(0%, 7%, 12%, 16%)

Oklch

oklch(83.9% 0.023 58.7)

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

#E3C3AA

Apricot · Wheat · Peach Orange

HEX

#E3C3AA

RGB

rgb(227, 195, 170)

HSL

hsl(26, 50%, 78%)

HSB

hsb(26, 25%, 89%)

CMYK

cmyk(0%, 14%, 25%, 11%)

Oklch

oklch(83.8% 0.050 60.0)

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

#E6D7C2

Goose Yellow · Wheat · Peach Orange

HEX

#E6D7C2

RGB

rgb(230, 215, 194)

HSL

hsl(35, 42%, 83%)

HSB

hsb(35, 16%, 90%)

CMYK

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

Oklch

oklch(88.6% 0.033 76.4)

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

#E8E9DB

Fresh Green · Beige · Lemon Cream

HEX

#E8E9DB

RGB

rgb(232, 233, 219)

HSL

hsl(64, 24%, 89%)

HSB

hsb(64, 6%, 91%)

CMYK

cmyk(0%, 0%, 6%, 9%)

Oklch

oklch(92.9% 0.019 110.1)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CAE3DD

E3CACF

Analogous

CAE3D0

CAE3DD

CADCE3

Triadic

CAE3DD

DDCAE3

E3DDCA

Split-Comp.

CAE3DD

E3CADC

E3D0CA

Tetradic

CAE3DD

D0CAE3

E3CACF

DCE3CA

Contrast Matrix WCAG 2.1 Contrast

CAE3DD	D6C7BC	E3C3AA	E6D7C2	E8E9DB
—	1.2 Fail	1.2 Fail	1.0 Fail	1.1 Fail
1.2 Fail	—	1.0 Fail	1.2 Fail	1.3 Fail
1.2 Fail	1.0 Fail	—	1.2 Fail	1.4 Fail
1.0 Fail	1.2 Fail	1.2 Fail	—	1.2 Fail
1.1 Fail	1.3 Fail	1.4 Fail	1.2 Fail	—

White BG

1.4Fail

1.6Fail

1.7Fail

1.4Fail

1.2Fail

Black BG

15.5AAA

12.8AAA

12.7AAA

14.9AAA

17.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D5D5DE

D0CFBF

D5D5B0

E0DFC7

E8E8DE

Deuteranopia

D3D1DF

D0D1BF

D7D9B2

E0E2C8

E8E8DF

Tritanopia

CBE0E0

D5C1C1

E1B5B6

E5CBCC

E8E1E2

Achromatopsia

DBDBDB

CACACA

D9D9D9

E7E7E7

Shades & Tints Shades & Tints

#CAE3DD

Dark

Light

#D6C7BC

Dark

Light

#E3C3AA

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cae3dd;
  --color-2: #d6c7bc;
  --color-3: #e3c3aa;
  --color-4: #e6d7c2;
  --color-5: #e8e9db;
}

SCSS

$color-1: #cae3dd;
$color-2: #d6c7bc;
$color-3: #e3c3aa;
$color-4: #e6d7c2;
$color-5: #e8e9db;

TAILWIND

colors: {
  'brand-1': '#cae3dd',
  'brand-2': '#d6c7bc',
  'brand-3': '#e3c3aa',
  'brand-4': '#e6d7c2',
  'brand-5': '#e8e9db',
}

RGB Array

[202, 227, 221], [214, 199, 188], [227, 195, 170], [230, 215, 194], [232, 233, 219]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CAE3DD, #D6C7BC, #E3C3AA, #E6D7C2, #E8E9DB 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: #cae3dd; --color-2: #d6c7bc; --color-3: #e3c3aa; --color-4: #e6d7c2; --color-5: #e8e9db. 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 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