#E0CEAC + #F5E5CC + #FAF1E8 + #F1DDE4 + #C1C2C0 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E0CEAC

Goose Yellow · Wheat · Peach Orange

HEX

#E0CEAC

RGB

rgb(224, 206, 172)

HSL

hsl(39, 46%, 78%)

HSB

hsb(39, 23%, 88%)

CMYK

cmyk(0%, 8%, 23%, 12%)

Oklch

oklch(85.8% 0.050 83.3)

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

#F5E5CC

Goose Yellow · Bisque · Peach Orange

HEX

#F5E5CC

RGB

rgb(245, 229, 204)

HSL

hsl(37, 67%, 88%)

HSB

hsb(37, 17%, 96%)

CMYK

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

Oklch

oklch(92.8% 0.037 79.1)

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

#FAF1E8

Goose Yellow · Linen · Peach Orange

HEX

#FAF1E8

RGB

rgb(250, 241, 232)

HSL

hsl(30, 64%, 95%)

HSB

hsb(30, 7%, 98%)

CMYK

cmyk(0%, 4%, 7%, 2%)

Oklch

oklch(96.3% 0.015 67.6)

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

#F1DDE4

Rouge · Linen · Cherry Blossom

HEX

#F1DDE4

RGB

rgb(241, 221, 228)

HSL

hsl(339, 42%, 91%)

HSB

hsb(339, 8%, 95%)

CMYK

cmyk(0%, 8%, 5%, 5%)

Oklch

oklch(91.6% 0.024 354.3)

Traditional「Rouge」· Paint「Cherry Blossom」· Creative Rose Petal

#C1C2C0

Silver Gray · Silver · Pearl Gray

HEX

#C1C2C0

RGB

rgb(193, 194, 192)

HSL

hsl(90, 2%, 76%)

HSB

hsb(90, 1%, 76%)

CMYK

cmyk(1%, 0%, 1%, 24%)

Oklch

oklch(81.3% 0.003 128.5)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E0CEAC

ADBFE1

Analogous

E1B5AD

E0CEAC

D9E1AD

Triadic

E0CEAC

ADE1CF

CFADE1

Split-Comp.

E0CEAC

ADD9E1

B5ADE1

Tetradic

E0CEAC

ADE1B5

ADBFE1

E1ADD9

Contrast Matrix WCAG 2.1 Contrast

E0CEAC	F5E5CC	FAF1E8	F1DDE4	C1C2C0
—	1.2 Fail	1.4 Fail	1.2 Fail	1.2 Fail
1.2 Fail	—	1.1 Fail	1.0 Fail	1.4 Fail
1.4 Fail	1.1 Fail	—	1.2 Fail	1.6 Fail
1.2 Fail	1.0 Fail	1.2 Fail	—	1.4 Fail
1.2 Fail	1.4 Fail	1.6 Fail	1.4 Fail	—

White BG

1.5Fail

1.2Fail

1.1Fail

1.3Fail

1.8Fail

Black BG

13.6AAA

17.0AAA

18.8AAA

16.2AAA

11.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D8D8B4

EEEED2

F6F6EA

E8E8E2

C1C1C0

Deuteranopia

D9DBB6

EFF0D4

F7F7EB

EAEBE2

C1C1C1

Tritanopia

DFBBBC

F4D7D8

FAECEC

F0E1E1

C1C1C1

Achromatopsia

D0D0D0

E7E7E7

F3F3F3

E4E4E4

C1C1C1

Shades & Tints Shades & Tints

#E0CEAC

Dark

Light

#F5E5CC

Dark

Light

#FAF1E8

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e0ceac;
  --color-2: #f5e5cc;
  --color-3: #faf1e8;
  --color-4: #f1dde4;
  --color-5: #c1c2c0;
}

SCSS

$color-1: #e0ceac;
$color-2: #f5e5cc;
$color-3: #faf1e8;
$color-4: #f1dde4;
$color-5: #c1c2c0;

TAILWIND

colors: {
  'brand-1': '#e0ceac',
  'brand-2': '#f5e5cc',
  'brand-3': '#faf1e8',
  'brand-4': '#f1dde4',
  'brand-5': '#c1c2c0',
}

RGB Array

[224, 206, 172], [245, 229, 204], [250, 241, 232], [241, 221, 228], [193, 194, 192]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E0CEAC, #F5E5CC, #FAF1E8, #F1DDE4, #C1C2C0 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: #e0ceac; --color-2: #f5e5cc; --color-3: #faf1e8; --color-4: #f1dde4; --color-5: #c1c2c0. 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