← Back to Editor

#E0B887 · #C9AC87 · #BDB5AC · #BACCBA · #D2D9B8

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

#E0B887

Ginger · BurlyWood · Warm Sun

HEX
#E0B887
RGB
rgb(224, 184, 135)
HSL
hsl(33, 59%, 70%)
HSB
hsb(33, 40%, 88%)
CMYK
cmyk(0%, 18%, 40%, 12%)
Oklch
oklch(80.6% 0.079 72.0)

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

#C9AC87

Ginger · Tan · Warm Sun

HEX
#C9AC87
RGB
rgb(201, 172, 135)
HSL
hsl(34, 38%, 66%)
HSB
hsb(34, 33%, 79%)
CMYK
cmyk(0%, 14%, 33%, 21%)
Oklch
oklch(76.1% 0.060 73.5)

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

#BDB5AC

Goose Yellow · Silver · Warm Sun

HEX
#BDB5AC
RGB
rgb(189, 181, 172)
HSL
hsl(32, 11%, 71%)
HSB
hsb(32, 9%, 74%)
CMYK
cmyk(0%, 4%, 9%, 26%)
Oklch
oklch(77.7% 0.016 70.8)

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

#BACCBA

Celadon · Silver · Apple Green

HEX
#BACCBA
RGB
rgb(186, 204, 186)
HSL
hsl(120, 15%, 76%)
HSB
hsb(120, 9%, 80%)
CMYK
cmyk(9%, 0%, 9%, 20%)
Oklch
oklch(82.6% 0.032 145.3)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#D2D9B8

Willow Green · LightGray · Apple Green

HEX
#D2D9B8
RGB
rgb(210, 217, 184)
HSL
hsl(73, 30%, 79%)
HSB
hsb(73, 15%, 85%)
CMYK
cmyk(3%, 0%, 15%, 15%)
Oklch
oklch(87.1% 0.045 117.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E0B887
85AEE0

Analogous

E08A85
E0B887
DBE085

Triadic

E0B887
85E0B7
B785E0

Split-Comp.

E0B887
85DBE0
8A85E0

Tetradic

E0B887
85E08A
85AEE0
E085DB

Contrast Matrix WCAG 2.1 Contrast

E0B887
C9AC87
BDB5AC
BACCBA
D2D9B8
—
1.2
Fail
1.1
Fail
1.1
Fail
1.3
Fail
1.2
Fail
—
1.1
Fail
1.3
Fail
1.5
Fail
1.1
Fail
1.1
Fail
—
1.2
Fail
1.4
Fail
1.1
Fail
1.3
Fail
1.2
Fail
—
1.2
Fail
1.3
Fail
1.5
Fail
1.4
Fail
1.2
Fail
—
White BG
1.8Fail
2.2Fail
2.0Fail
1.7Fail
1.5Fail
Black BG
11.4AAA
9.7AAA
10.4AAA
12.4AAA
14.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CFCE93
BCBC90
BAB9AE
C2C2BE
D5D5C0

Deuteranopia

D1D496
BEC092
BABBAF
C1BFBF
D5D4C2

Tritanopia

DE9C9E
C89799
BDB0B0
BBC2C3
D2C6C8

Achromatopsia

BEBEBE
B0B0B0
B6B6B6
C5C5C5
D3D3D3

Shades & Tints Shades & Tints

#E0B887

Dark
Light

#C9AC87

Dark
Light

#BDB5AC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e0b887;
  --color-2: #c9ac87;
  --color-3: #bdb5ac;
  --color-4: #baccba;
  --color-5: #d2d9b8;
}

SCSS

$color-1: #e0b887;
$color-2: #c9ac87;
$color-3: #bdb5ac;
$color-4: #baccba;
$color-5: #d2d9b8;

TAILWIND

colors: {
  'brand-1': '#e0b887',
  'brand-2': '#c9ac87',
  'brand-3': '#bdb5ac',
  'brand-4': '#baccba',
  'brand-5': '#d2d9b8',
}

RGB Array

[224, 184, 135], [201, 172, 135], [189, 181, 172], [186, 204, 186], [210, 217, 184]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E0B887, #C9AC87, #BDB5AC, #BACCBA, #D2D9B8 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: #e0b887; --color-2: #c9ac87; --color-3: #bdb5ac; --color-4: #baccba; --color-5: #d2d9b8. 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