#BCC9AE + #DFCA97 + #E0BE7C + #E1A26C + #E48479 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#BCC9AE

Willow Green · Silver · Apple Green

HEX

#BCC9AE

RGB

rgb(188, 201, 174)

HSL

hsl(89, 20%, 74%)

HSB

hsb(89, 13%, 79%)

CMYK

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

Oklch

oklch(81.9% 0.040 128.3)

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

#DFCA97

Goose Yellow · BurlyWood · Sunflower

HEX

#DFCA97

RGB

rgb(223, 202, 151)

HSL

hsl(42, 53%, 73%)

HSB

hsb(42, 32%, 87%)

CMYK

cmyk(0%, 9%, 32%, 13%)

Oklch

oklch(84.4% 0.071 88.2)

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

#E0BE7C

Ginger · BurlyWood · Sunflower

HEX

#E0BE7C

RGB

rgb(224, 190, 124)

HSL

hsl(40, 62%, 68%)

HSB

hsb(40, 45%, 88%)

CMYK

cmyk(0%, 15%, 45%, 12%)

Oklch

oklch(81.6% 0.093 83.3)

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

#E1A26C

Apricot · DarkSalmon · Warm Sun

HEX

#E1A26C

RGB

rgb(225, 162, 108)

HSL

hsl(28, 66%, 65%)

HSB

hsb(28, 52%, 88%)

CMYK

cmyk(0%, 28%, 52%, 12%)

Oklch

oklch(76.1% 0.103 61.0)

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

#E48479

Peach Pink · LightCoral · Coral Red

HEX

#E48479

RGB

rgb(228, 132, 121)

HSL

hsl(6, 66%, 68%)

HSB

hsb(6, 47%, 89%)

CMYK

cmyk(0%, 42%, 47%, 11%)

Oklch

oklch(71.4% 0.120 27.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BCC9AE

BCAFCA

Analogous

CACAAF

BCC9AE

B0CAAF

Triadic

BCC9AE

AFBDCA

CAAFBD

Split-Comp.

BCC9AE

AFB0CA

CAAFCA

Tetradic

BCC9AE

AFCACA

BCAFCA

CAAFB0

Contrast Matrix WCAG 2.1 Contrast

BCC9AE	DFCA97	E0BE7C	E1A26C	E48479
—	1.1 Fail	1.0 Fail	1.3 Fail	1.5 Fail
1.1 Fail	—	1.1 Fail	1.4 Fail	1.7 Fail
1.0 Fail	1.1 Fail	—	1.2 Fail	1.5 Fail
1.3 Fail	1.4 Fail	1.2 Fail	—	1.2 Fail
1.5 Fail	1.7 Fail	1.5 Fail	1.2 Fail	—

White BG

1.7Fail

1.6Fail

1.8Fail

2.2Fail

2.7Fail

Black BG

12.1AAA

13.0AAA

11.8AAA

9.6AAA

7.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C2C2B5

D6D6A3

D1D18C

C6C579

BABA7C

Deuteranopia

C1C0B6

D7D9A6

D3D690

C9CE7C

C0C77C

Tritanopia

BDBABB

DEADAF

DE999B

DE8386

DF7E7E

Achromatopsia

C2C2C2

CACACA

C1C1C1

AFAFAF

9F9F9F

Shades & Tints Shades & Tints

#BCC9AE

Dark

Light

#DFCA97

Dark

Light

#E0BE7C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bcc9ae;
  --color-2: #dfca97;
  --color-3: #e0be7c;
  --color-4: #e1a26c;
  --color-5: #e48479;
}

SCSS

$color-1: #bcc9ae;
$color-2: #dfca97;
$color-3: #e0be7c;
$color-4: #e1a26c;
$color-5: #e48479;

TAILWIND

colors: {
  'brand-1': '#bcc9ae',
  'brand-2': '#dfca97',
  'brand-3': '#e0be7c',
  'brand-4': '#e1a26c',
  'brand-5': '#e48479',
}

RGB Array

[188, 201, 174], [223, 202, 151], [224, 190, 124], [225, 162, 108], [228, 132, 121]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BCC9AE, #DFCA97, #E0BE7C, #E1A26C, #E48479 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: #bcc9ae; --color-2: #dfca97; --color-3: #e0be7c; --color-4: #e1a26c; --color-5: #e48479. 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