#E7D1B3 + #ECA7A5 + #EC9A97 + #D78D8B + #C97775 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E7D1B3

Goose Yellow · Wheat · Peach Orange

HEX

#E7D1B3

RGB

rgb(231, 209, 179)

HSL

hsl(35, 52%, 80%)

HSB

hsb(35, 23%, 91%)

CMYK

cmyk(0%, 10%, 23%, 9%)

Oklch

oklch(87.1% 0.047 75.6)

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

#ECA7A5

Peach Pink · LightPink · Coral Red

HEX

#ECA7A5

RGB

rgb(236, 167, 165)

HSL

hsl(2, 65%, 79%)

HSB

hsb(2, 30%, 93%)

CMYK

cmyk(0%, 29%, 30%, 7%)

Oklch

oklch(79.4% 0.082 20.9)

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

#EC9A97

Peach Pink · DarkSalmon · Coral Red

HEX

#EC9A97

RGB

rgb(236, 154, 151)

HSL

hsl(2, 69%, 76%)

HSB

hsb(2, 36%, 93%)

CMYK

cmyk(0%, 35%, 36%, 7%)

Oklch

oklch(76.7% 0.099 21.9)

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

#D78D8B

Peach Pink · DarkSalmon · Coral Red

HEX

#D78D8B

RGB

rgb(215, 141, 139)

HSL

hsl(2, 49%, 69%)

HSB

hsb(2, 35%, 84%)

CMYK

cmyk(0%, 34%, 35%, 16%)

Oklch

oklch(71.8% 0.091 21.3)

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

#C97775

Peach Pink · LightCoral · Coral Red

HEX

#C97775

RGB

rgb(201, 119, 117)

HSL

hsl(1, 44%, 62%)

HSB

hsb(1, 42%, 79%)

CMYK

cmyk(0%, 41%, 42%, 21%)

Oklch

oklch(65.8% 0.103 21.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E7D1B3

B1C8E7

Analogous

E7B6B1

E7D1B3

E2E7B1

Triadic

E7D1B3

B1E7D0

D0B1E7

Split-Comp.

E7D1B3

B1E2E7

B6B1E7

Tetradic

E7D1B3

B1E7B6

B1C8E7

E7B1E2

Contrast Matrix WCAG 2.1 Contrast

E7D1B3	ECA7A5	EC9A97	D78D8B	C97775
—	1.3 Fail	1.5 Fail	1.8 Fail	2.2 Fail
1.3 Fail	—	1.1 Fail	1.3 Fail	1.7 Fail
1.5 Fail	1.1 Fail	—	1.2 Fail	1.5 Fail
1.8 Fail	1.3 Fail	1.2 Fail	—	1.3 Fail
2.2 Fail	1.7 Fail	1.5 Fail	1.3 Fail	—

White BG

1.5Fail

2.0Fail

2.2Fail

2.6Fail

3.3AA Large

Black BG

14.2AAA

10.6AAA

9.6AAA

8.1AAA

6.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DDDDBA

CECEA5

C8C898

B7B68B

A5A575

Deuteranopia

DFE0BC

D2D7A6

CDD398

BBC18C

AAB076

Tritanopia

E6C0C1

E9A6A6

E89898

D38C8C

C57676

Achromatopsia

D4D4D4

BBBBBB

B2B2B2

A3A3A3

8F8F8F

Shades & Tints Shades & Tints

#E7D1B3

Dark

Light

#ECA7A5

Dark

Light

#EC9A97

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e7d1b3;
  --color-2: #eca7a5;
  --color-3: #ec9a97;
  --color-4: #d78d8b;
  --color-5: #c97775;
}

SCSS

$color-1: #e7d1b3;
$color-2: #eca7a5;
$color-3: #ec9a97;
$color-4: #d78d8b;
$color-5: #c97775;

TAILWIND

colors: {
  'brand-1': '#e7d1b3',
  'brand-2': '#eca7a5',
  'brand-3': '#ec9a97',
  'brand-4': '#d78d8b',
  'brand-5': '#c97775',
}

RGB Array

[231, 209, 179], [236, 167, 165], [236, 154, 151], [215, 141, 139], [201, 119, 117]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E7D1B3, #ECA7A5, #EC9A97, #D78D8B, #C97775 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: #e7d1b3; --color-2: #eca7a5; --color-3: #ec9a97; --color-4: #d78d8b; --color-5: #c97775. 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