#E0B064 + #D3D888 + #A1CEAD + #E0E7C6 + #C1BEB9 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E0B064

Ginger · SandyBrown · Warm Sun

HEX

#E0B064

RGB

rgb(224, 176, 100)

HSL

hsl(37, 67%, 64%)

HSB

hsb(37, 55%, 88%)

CMYK

cmyk(0%, 21%, 55%, 12%)

Oklch

oklch(78.5% 0.109 77.6)

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

#D3D888

Fresh Green · Khaki · Sunflower

HEX

#D3D888

RGB

rgb(211, 216, 136)

HSL

hsl(64, 51%, 69%)

HSB

hsb(64, 37%, 85%)

CMYK

cmyk(2%, 0%, 37%, 15%)

Oklch

oklch(86.0% 0.102 111.4)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#A1CEAD

Celadon · DarkGray · Apple Green

HEX

#A1CEAD

RGB

rgb(161, 206, 173)

HSL

hsl(136, 31%, 72%)

HSB

hsb(136, 22%, 81%)

CMYK

cmyk(22%, 0%, 16%, 19%)

Oklch

oklch(81.0% 0.066 153.0)

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

#E0E7C6

Willow Green · LightGray · Mint Green

HEX

#E0E7C6

RGB

rgb(224, 231, 198)

HSL

hsl(73, 41%, 84%)

HSB

hsb(73, 14%, 91%)

CMYK

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

Oklch

oklch(91.4% 0.044 117.0)

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

#C1BEB9

Silver Gray · Silver · Pearl Gray

HEX

#C1BEB9

RGB

rgb(193, 190, 185)

HSL

hsl(38, 6%, 74%)

HSB

hsb(38, 4%, 76%)

CMYK

cmyk(0%, 2%, 4%, 24%)

Oklch

oklch(80.2% 0.008 80.7)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E0B064

6695E1

Analogous

E17466

E0B064

D2E166

Triadic

E0B064

66E1B2

B266E1

Split-Comp.

E0B064

66D2E1

7466E1

Tetradic

E0B064

66E174

6695E1

E166D2

Contrast Matrix WCAG 2.1 Contrast

E0B064	D3D888	A1CEAD	E0E7C6	C1BEB9
—	1.3 Fail	1.1 Fail	1.6 Fail	1.1 Fail
1.3 Fail	—	1.2 Fail	1.2 Fail	1.2 Fail
1.1 Fail	1.2 Fail	—	1.4 Fail	1.1 Fail
1.6 Fail	1.2 Fail	1.4 Fail	—	1.4 Fail
1.1 Fail	1.2 Fail	1.1 Fail	1.4 Fail	—

White BG

2.0Fail

1.5Fail

1.8Fail

1.3Fail

1.9Fail

Black BG

10.6AAA

13.9AAA

11.9AAA

16.4AAA

11.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CBCB76

D5D59B

B4B5B5

E3E3CE

C0C0BA

Deuteranopia

CED27B

D5D5A0

B2AFB7

E3E2D0

C0C0BB

Tritanopia

DE8588

D3ABAE

A3BBBD

E0D4D6

C1BBBB

Achromatopsia

B6B6B6

CDCDCD

BDBDBD

E1E1E1

BEBEBE

Shades & Tints Shades & Tints

#E0B064

Dark

Light

#D3D888

Dark

Light

#A1CEAD

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e0b064;
  --color-2: #d3d888;
  --color-3: #a1cead;
  --color-4: #e0e7c6;
  --color-5: #c1beb9;
}

SCSS

$color-1: #e0b064;
$color-2: #d3d888;
$color-3: #a1cead;
$color-4: #e0e7c6;
$color-5: #c1beb9;

TAILWIND

colors: {
  'brand-1': '#e0b064',
  'brand-2': '#d3d888',
  'brand-3': '#a1cead',
  'brand-4': '#e0e7c6',
  'brand-5': '#c1beb9',
}

RGB Array

[224, 176, 100], [211, 216, 136], [161, 206, 173], [224, 231, 198], [193, 190, 185]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E0B064, #D3D888, #A1CEAD, #E0E7C6, #C1BEB9 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: #e0b064; --color-2: #d3d888; --color-3: #a1cead; --color-4: #e0e7c6; --color-5: #c1beb9. 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