← Back to Editor

#ECCCB7 · #D0C1AE · #CEB067 · #E98472 · #A19472

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#ECCCB7

Apricot · Wheat · Peach Orange

HEX
#ECCCB7
RGB
rgb(236, 204, 183)
HSL
hsl(24, 58%, 82%)
HSB
hsb(24, 22%, 93%)
CMYK
cmyk(0%, 14%, 22%, 7%)
Oklch
oklch(86.7% 0.046 55.3)

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

#D0C1AE

Goose Yellow · Silver · Warm Sun

HEX
#D0C1AE
RGB
rgb(208, 193, 174)
HSL
hsl(34, 27%, 75%)
HSB
hsb(34, 16%, 82%)
CMYK
cmyk(0%, 7%, 16%, 18%)
Oklch
oklch(81.8% 0.031 73.8)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#CEB067

Ginger · BurlyWood · Sunflower

HEX
#CEB067
RGB
rgb(206, 176, 103)
HSL
hsl(43, 51%, 61%)
HSB
hsb(43, 50%, 81%)
CMYK
cmyk(0%, 15%, 50%, 19%)
Oklch
oklch(76.8% 0.099 87.7)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#E98472

Peach Pink · LightCoral · Coral Red

HEX
#E98472
RGB
rgb(233, 132, 114)
HSL
hsl(9, 73%, 68%)
HSB
hsb(9, 51%, 91%)
CMYK
cmyk(0%, 43%, 51%, 9%)
Oklch
oklch(71.9% 0.128 31.1)

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

#A19472

Ginger · Gray · Sunflower

HEX
#A19472
RGB
rgb(161, 148, 114)
HSL
hsl(43, 20%, 54%)
HSB
hsb(43, 29%, 63%)
CMYK
cmyk(0%, 8%, 29%, 37%)
Oklch
oklch(66.9% 0.050 89.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

ECCCB7
B6D6EC

Analogous

ECB6BC
ECCCB7
ECE6B6

Triadic

ECCCB7
B6ECCC
CCB6EC

Split-Comp.

ECCCB7
B6ECE6
B6BCEC

Tetradic

ECCCB7
BCECB6
B6D6EC
E6B6EC

Contrast Matrix WCAG 2.1 Contrast

ECCCB7
D0C1AE
CEB067
E98472
A19472
—
1.2
Fail
1.4
Fail
1.7
Fail
2.0
Fail
1.2
Fail
—
1.2
Fail
1.5
Fail
1.7
Fail
1.4
Fail
1.2
Fail
—
1.3
Fail
1.4
Fail
1.7
Fail
1.5
Fail
1.3
Fail
—
1.1
Fail
2.0
Fail
1.7
Fail
1.4
Fail
1.1
Fail
—
White BG
1.5Fail
1.8Fail
2.1Fail
2.6Fail
3.0AA Large
Black BG
13.9AAA
11.9AAA
10.0AAA
8.0AAA
7.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DEDEBC
CAC9B3
C1C179
BDBC76
9B9B7A

Deuteranopia

E0E2BD
CACCB4
C3C57D
C3CB77
9C9D7C

Tritanopia

EAC0C1
CFB6B7
CD878A
E47A7B
A08182

Achromatopsia

D3D3D3
C3C3C3
B1B1B1
A0A0A0
949494

Shades & Tints Shades & Tints

#ECCCB7

Dark
Light

#D0C1AE

Dark
Light

#CEB067

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ecccb7;
  --color-2: #d0c1ae;
  --color-3: #ceb067;
  --color-4: #e98472;
  --color-5: #a19472;
}

SCSS

$color-1: #ecccb7;
$color-2: #d0c1ae;
$color-3: #ceb067;
$color-4: #e98472;
$color-5: #a19472;

TAILWIND

colors: {
  'brand-1': '#ecccb7',
  'brand-2': '#d0c1ae',
  'brand-3': '#ceb067',
  'brand-4': '#e98472',
  'brand-5': '#a19472',
}

RGB Array

[236, 204, 183], [208, 193, 174], [206, 176, 103], [233, 132, 114], [161, 148, 114]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #ECCCB7, #D0C1AE, #CEB067, #E98472, #A19472 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: #ecccb7; --color-2: #d0c1ae; --color-3: #ceb067; --color-4: #e98472; --color-5: #a19472. 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