#E1D4B2 + #EBE2C3 + #CCC131 + #9F9474 + #E3B289 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E1D4B2

Goose Yellow · Wheat · Lemon Cream

HEX

#E1D4B2

RGB

rgb(225, 212, 178)

HSL

hsl(43, 44%, 79%)

HSB

hsb(43, 21%, 88%)

CMYK

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

Oklch

oklch(87.2% 0.047 89.6)

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

#EBE2C3

Goose Yellow · Wheat · Lemon Cream

HEX

#EBE2C3

RGB

rgb(235, 226, 195)

HSL

hsl(47, 50%, 84%)

HSB

hsb(47, 17%, 92%)

CMYK

cmyk(0%, 4%, 17%, 8%)

Oklch

oklch(91.2% 0.042 93.7)

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

#CCC131

Autumn Sage · GoldenRod · Honey Gold

HEX

#CCC131

RGB

rgb(204, 193, 49)

HSL

hsl(56, 61%, 50%)

HSB

hsb(56, 76%, 80%)

CMYK

cmyk(0%, 5%, 76%, 20%)

Oklch

oklch(79.6% 0.155 104.9)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#9F9474

Ginger · Gray · Sunflower

HEX

#9F9474

RGB

rgb(159, 148, 116)

HSL

hsl(45, 18%, 54%)

HSB

hsb(45, 27%, 62%)

CMYK

cmyk(0%, 7%, 27%, 38%)

Oklch

oklch(66.8% 0.047 91.3)

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

#E3B289

Apricot · BurlyWood · Warm Sun

HEX

#E3B289

RGB

rgb(227, 178, 137)

HSL

hsl(27, 62%, 71%)

HSB

hsb(27, 40%, 89%)

CMYK

cmyk(0%, 22%, 40%, 11%)

Oklch

oklch(79.8% 0.079 61.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E1D4B2

B2BFE1

Analogous

E1BCB2

E1D4B2

D7E1B2

Triadic

E1D4B2

B2E1D4

D4B2E1

Split-Comp.

E1D4B2

B2D7E1

BCB2E1

Tetradic

E1D4B2

B2E1BC

B2BFE1

E1B2D7

Contrast Matrix WCAG 2.1 Contrast

E1D4B2	EBE2C3	CCC131	9F9474	E3B289
—	1.1 Fail	1.3 Fail	2.0 Fail	1.3 Fail
1.1 Fail	—	1.4 Fail	2.3 Fail	1.5 Fail
1.3 Fail	1.4 Fail	—	1.6 Fail	1.0 Fail
2.0 Fail	2.3 Fail	1.6 Fail	—	1.6 Fail
1.3 Fail	1.5 Fail	1.0 Fail	1.6 Fail	—

White BG

1.5Fail

1.3Fail

1.9Fail

3.0AA Large

1.9Fail

Black BG

14.3AAA

16.2AAA

11.2AAA

7.0AA

11.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DBDBBA

E7E7CB

C7C754

9A9A7C

CECD93

Deuteranopia

DCDDBC

E8E8CC

C8C95C

9B9C7E

D1D495

Tritanopia

E0C1C2

EBD0D2

CB6F75

9E8283

E19B9C

Achromatopsia

D4D4D4

E1E1E1

B4B4B4

949494

BCBCBC

Shades & Tints Shades & Tints

#E1D4B2

Dark

Light

#EBE2C3

Dark

Light

#CCC131

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e1d4b2;
  --color-2: #ebe2c3;
  --color-3: #ccc131;
  --color-4: #9f9474;
  --color-5: #e3b289;
}

SCSS

$color-1: #e1d4b2;
$color-2: #ebe2c3;
$color-3: #ccc131;
$color-4: #9f9474;
$color-5: #e3b289;

TAILWIND

colors: {
  'brand-1': '#e1d4b2',
  'brand-2': '#ebe2c3',
  'brand-3': '#ccc131',
  'brand-4': '#9f9474',
  'brand-5': '#e3b289',
}

RGB Array

[225, 212, 178], [235, 226, 195], [204, 193, 49], [159, 148, 116], [227, 178, 137]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E1D4B2, #EBE2C3, #CCC131, #9F9474, #E3B289 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: #e1d4b2; --color-2: #ebe2c3; --color-3: #ccc131; --color-4: #9f9474; --color-5: #e3b289. 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