#BDC2AC + #BAEACA + #C5F9AF + #E0DEC5 + #E9D2B2 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#BDC2AC

Willow Green · Silver · Apple Green

HEX

#BDC2AC

RGB

rgb(189, 194, 172)

HSL

hsl(74, 15%, 72%)

HSB

hsb(74, 11%, 76%)

CMYK

cmyk(3%, 0%, 11%, 24%)

Oklch

oklch(80.4% 0.031 117.5)

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

#BAEACA

Emerald · LightGray · Mint Green

HEX

#BAEACA

RGB

rgb(186, 234, 202)

HSL

hsl(140, 53%, 82%)

HSB

hsb(140, 21%, 92%)

CMYK

cmyk(21%, 0%, 14%, 8%)

Oklch

oklch(89.5% 0.066 155.7)

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

#C5F9AF

Emerald · LightGray · Mint Green

HEX

#C5F9AF

RGB

rgb(197, 249, 175)

HSL

hsl(102, 86%, 83%)

HSB

hsb(102, 30%, 98%)

CMYK

cmyk(21%, 0%, 30%, 2%)

Oklch

oklch(92.8% 0.111 136.6)

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

#E0DEC5

Fresh Green · LightGray · Lemon Cream

HEX

#E0DEC5

RGB

rgb(224, 222, 197)

HSL

hsl(56, 30%, 83%)

HSB

hsb(56, 12%, 88%)

CMYK

cmyk(0%, 1%, 12%, 12%)

Oklch

oklch(89.6% 0.033 103.3)

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

#E9D2B2

Goose Yellow · Wheat · Peach Orange

HEX

#E9D2B2

RGB

rgb(233, 210, 178)

HSL

hsl(35, 56%, 81%)

HSB

hsb(35, 24%, 91%)

CMYK

cmyk(0%, 10%, 24%, 9%)

Oklch

oklch(87.5% 0.050 76.1)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BDC2AC

B2ADC2

Analogous

C2BDAD

BDC2AC

B3C2AD

Triadic

BDC2AC

ADBDC2

C2ADBD

Split-Comp.

BDC2AC

ADB3C2

BDADC2

Tetradic

BDC2AC

ADC2BD

B2ADC2

C2ADB3

Contrast Matrix WCAG 2.1 Contrast

BDC2AC	BAEACA	C5F9AF	E0DEC5	E9D2B2
—	1.4 Fail	1.5 Fail	1.3 Fail	1.2 Fail
1.4 Fail	—	1.1 Fail	1.0 Fail	1.1 Fail
1.5 Fail	1.1 Fail	—	1.1 Fail	1.2 Fail
1.3 Fail	1.0 Fail	1.1 Fail	—	1.1 Fail
1.2 Fail	1.1 Fail	1.2 Fail	1.1 Fail	—

White BG

1.8Fail

1.3Fail

1.2Fail

1.4Fail

1.5Fail

Black BG

11.5AAA

15.7AAA

17.5AAA

15.4AAA

14.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BFBFB1

CFCFD2

DCDCC1

DFDFCB

DFDFBA

Deuteranopia

BFBEB3

CCC8D4

D9D5C5

DFDFCC

E0E2BC

Tritanopia

BDB6B6

BCD8D9

C8CFD2

E0D0D1

E8C0C1

Achromatopsia

BEBEBE

D8D8D8

E1E1E1

DCDCDC

D5D5D5

Shades & Tints Shades & Tints

#BDC2AC

Dark

Light

#BAEACA

Dark

Light

#C5F9AF

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bdc2ac;
  --color-2: #baeaca;
  --color-3: #c5f9af;
  --color-4: #e0dec5;
  --color-5: #e9d2b2;
}

SCSS

$color-1: #bdc2ac;
$color-2: #baeaca;
$color-3: #c5f9af;
$color-4: #e0dec5;
$color-5: #e9d2b2;

TAILWIND

colors: {
  'brand-1': '#bdc2ac',
  'brand-2': '#baeaca',
  'brand-3': '#c5f9af',
  'brand-4': '#e0dec5',
  'brand-5': '#e9d2b2',
}

RGB Array

[189, 194, 172], [186, 234, 202], [197, 249, 175], [224, 222, 197], [233, 210, 178]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BDC2AC, #BAEACA, #C5F9AF, #E0DEC5, #E9D2B2 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: #bdc2ac; --color-2: #baeaca; --color-3: #c5f9af; --color-4: #e0dec5; --color-5: #e9d2b2. 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