← Back to Editor

#E9B78D · #E0BE89 · #D8C484 · #D6C39E · #D4C1B7

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

#E9B78D

Apricot · BurlyWood · Warm Sun

HEX
#E9B78D
RGB
rgb(233, 183, 141)
HSL
hsl(27, 68%, 73%)
HSB
hsb(27, 39%, 91%)
CMYK
cmyk(0%, 21%, 39%, 9%)
Oklch
oklch(81.5% 0.080 61.4)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#E0BE89

Goose Yellow · BurlyWood · Warm Sun

HEX
#E0BE89
RGB
rgb(224, 190, 137)
HSL
hsl(37, 58%, 71%)
HSB
hsb(37, 39%, 88%)
CMYK
cmyk(0%, 15%, 39%, 12%)
Oklch
oklch(81.9% 0.079 78.4)

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

#D8C484

Ginger · BurlyWood · Sunflower

HEX
#D8C484
RGB
rgb(216, 196, 132)
HSL
hsl(46, 52%, 68%)
HSB
hsb(46, 39%, 85%)
CMYK
cmyk(0%, 9%, 39%, 15%)
Oklch
oklch(82.2% 0.086 92.7)

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

#D6C39E

Goose Yellow · Tan · Sunflower

HEX
#D6C39E
RGB
rgb(214, 195, 158)
HSL
hsl(40, 41%, 73%)
HSB
hsb(40, 26%, 84%)
CMYK
cmyk(0%, 9%, 26%, 16%)
Oklch
oklch(82.4% 0.054 83.9)

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

#D4C1B7

Apricot · Silver · Peach Orange

HEX
#D4C1B7
RGB
rgb(212, 193, 183)
HSL
hsl(21, 25%, 77%)
HSB
hsb(21, 14%, 83%)
CMYK
cmyk(0%, 9%, 14%, 17%)
Oklch
oklch(82.4% 0.026 49.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E9B78D
8BBFE9

Analogous

E98B90
E9B78D
E9E48B

Triadic

E9B78D
8BE9B5
B58BE9

Split-Comp.

E9B78D
8BE9E4
8B90E9

Tetradic

E9B78D
90E98B
8BBFE9
E48BE9

Contrast Matrix WCAG 2.1 Contrast

E9B78D
E0BE89
D8C484
D6C39E
D4C1B7
—
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
—
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
—
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
—
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
1.0
Fail
—
White BG
1.8Fail
1.8Fail
1.7Fail
1.7Fail
1.7Fail
Black BG
11.6AAA
11.9AAA
12.1AAA
12.2AAA
12.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D3D397
D1D196
CFCF93
CECEA7
CCCCB9

Deuteranopia

D6DA9A
D3D699
D1D297
CFD0A9
CDCEBA

Tritanopia

E79FA1
DEA0A2
D7A0A2
D5AEB0
D3BBBC

Achromatopsia

C1C1C1
C2C2C2
C3C3C3
C4C4C4
C6C6C6

Shades & Tints Shades & Tints

#E9B78D

Dark
Light

#E0BE89

Dark
Light

#D8C484

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e9b78d;
  --color-2: #e0be89;
  --color-3: #d8c484;
  --color-4: #d6c39e;
  --color-5: #d4c1b7;
}

SCSS

$color-1: #e9b78d;
$color-2: #e0be89;
$color-3: #d8c484;
$color-4: #d6c39e;
$color-5: #d4c1b7;

TAILWIND

colors: {
  'brand-1': '#e9b78d',
  'brand-2': '#e0be89',
  'brand-3': '#d8c484',
  'brand-4': '#d6c39e',
  'brand-5': '#d4c1b7',
}

RGB Array

[233, 183, 141], [224, 190, 137], [216, 196, 132], [214, 195, 158], [212, 193, 183]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E9B78D, #E0BE89, #D8C484, #D6C39E, #D4C1B7 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: #e9b78d; --color-2: #e0be89; --color-3: #d8c484; --color-4: #d6c39e; --color-5: #d4c1b7. 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