#C8E8E5 + #D8DECA + #DFC78E + #EB967F + #FB406F - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C8E8E5

Jade · LightGray · Glacier Blue

HEX

#C8E8E5

RGB

rgb(200, 232, 229)

HSL

hsl(174, 41%, 85%)

HSB

hsb(174, 14%, 91%)

CMYK

cmyk(14%, 0%, 1%, 9%)

Oklch

oklch(90.7% 0.034 189.7)

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

#D8DECA

Willow Green · LightGray · Mint Green

HEX

#D8DECA

RGB

rgb(216, 222, 202)

HSL

hsl(78, 23%, 83%)

HSB

hsb(78, 9%, 87%)

CMYK

cmyk(3%, 0%, 9%, 13%)

Oklch

oklch(89.1% 0.028 120.6)

Traditional「Willow Green」· Paint「Mint Green」· Creative Mint Breeze

#DFC78E

Goose Yellow · BurlyWood · Sunflower

HEX

#DFC78E

RGB

rgb(223, 199, 142)

HSL

hsl(42, 56%, 72%)

HSB

hsb(42, 36%, 87%)

CMYK

cmyk(0%, 11%, 36%, 13%)

Oklch

oklch(83.7% 0.079 87.7)

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

#EB967F

Peach Pink · DarkSalmon · Coral Red

HEX

#EB967F

RGB

rgb(235, 150, 127)

HSL

hsl(13, 73%, 71%)

HSB

hsb(13, 46%, 92%)

CMYK

cmyk(0%, 36%, 46%, 8%)

Oklch

oklch(75.4% 0.108 35.9)

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

#FB406F

Peach Pink · Tomato · Coral Red

HEX

#FB406F

RGB

rgb(251, 64, 111)

HSL

hsl(345, 96%, 62%)

HSB

hsb(345, 75%, 98%)

CMYK

cmyk(0%, 75%, 56%, 2%)

Oklch

oklch(66.1% 0.222 11.5)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C8E8E5

E8C9CC

Analogous

C9E8D6

C8E8E5

C9DCE8

Triadic

C8E8E5

E5C9E8

E8E5C9

Split-Comp.

C8E8E5

E8C9DC

E8D6C9

Tetradic

C8E8E5

D6C9E8

E8C9CC

DCE8C9

Contrast Matrix WCAG 2.1 Contrast

C8E8E5	D8DECA	DFC78E	EB967F	FB406F
—	1.1 Fail	1.3 Fail	1.8 Fail	2.7 Fail
1.1 Fail	—	1.2 Fail	1.7 Fail	2.5 Fail
1.3 Fail	1.2 Fail	—	1.4 Fail	2.1 Fail
1.8 Fail	1.7 Fail	1.4 Fail	—	1.5 Fail
2.7 Fail	2.5 Fail	2.1 Fail	1.5 Fail	—

White BG

1.3Fail

1.4Fail

1.7Fail

2.3Fail

3.5AA Large

Black BG

16.1AAA

15.2AAA

12.7AAA

9.2AAA

6.1AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D6D6E6

DBDBCF

D5D49C

C6C585

AAA864

Deuteranopia

D4D2E6

DADAD0

D6D89F

CBD286

B5C361

Tritanopia

CAE6E6

D8D3D4

DEA7A9

E7898A

F25B59

Achromatopsia

DEDEDE

DADADA

C8C8C8

ADADAD

7D7D7D

Shades & Tints Shades & Tints

#C8E8E5

Dark

Light

#D8DECA

Dark

Light

#DFC78E

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c8e8e5;
  --color-2: #d8deca;
  --color-3: #dfc78e;
  --color-4: #eb967f;
  --color-5: #fb406f;
}

SCSS

$color-1: #c8e8e5;
$color-2: #d8deca;
$color-3: #dfc78e;
$color-4: #eb967f;
$color-5: #fb406f;

TAILWIND

colors: {
  'brand-1': '#c8e8e5',
  'brand-2': '#d8deca',
  'brand-3': '#dfc78e',
  'brand-4': '#eb967f',
  'brand-5': '#fb406f',
}

RGB Array

[200, 232, 229], [216, 222, 202], [223, 199, 142], [235, 150, 127], [251, 64, 111]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C8E8E5, #D8DECA, #DFC78E, #EB967F, #FB406F 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: #c8e8e5; --color-2: #d8deca; --color-3: #dfc78e; --color-4: #eb967f; --color-5: #fb406f. 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