#BAE0CE + #EDF6C9 + #DCE19D + #B49D5B + #807A79 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#BAE0CE

Jade · LightBlue · Apple Green

HEX

#BAE0CE

RGB

rgb(186, 224, 206)

HSL

hsl(152, 38%, 80%)

HSB

hsb(152, 17%, 88%)

CMYK

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

Oklch

oklch(87.4% 0.047 165.0)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#EDF6C9

Willow Green · Beige · Mint Green

HEX

#EDF6C9

RGB

rgb(237, 246, 201)

HSL

hsl(72, 71%, 88%)

HSB

hsb(72, 18%, 96%)

CMYK

cmyk(4%, 0%, 18%, 4%)

Oklch

oklch(95.5% 0.059 116.7)

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

#DCE19D

Fresh Green · Khaki · Sunflower

HEX

#DCE19D

RGB

rgb(220, 225, 157)

HSL

hsl(64, 53%, 75%)

HSB

hsb(64, 30%, 88%)

CMYK

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

Oklch

oklch(89.0% 0.088 111.6)

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

#B49D5B

Ginger · DarkSalmon · Sunflower

HEX

#B49D5B

RGB

rgb(180, 157, 91)

HSL

hsl(44, 37%, 53%)

HSB

hsb(44, 49%, 71%)

CMYK

cmyk(0%, 13%, 49%, 29%)

Oklch

oklch(70.2% 0.090 90.8)

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

#807A79

Ink Gray · Gray · Warm Gray

HEX

#807A79

RGB

rgb(128, 122, 121)

HSL

hsl(9, 3%, 49%)

HSB

hsb(9, 5%, 50%)

CMYK

cmyk(0%, 5%, 5%, 50%)

Oklch

oklch(58.5% 0.008 28.9)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BAE0CE

DFB9CB

Analogous

B9DFBA

BAE0CE

B9DEDF

Triadic

BAE0CE

CDB9DF

DFCDB9

Split-Comp.

BAE0CE

DFB9DE

DFBAB9

Tetradic

BAE0CE

BAB9DF

DFB9CB

DEDFB9

Contrast Matrix WCAG 2.1 Contrast

BAE0CE	EDF6C9	DCE19D	B49D5B	807A79
—	1.3 Fail	1.0 Fail	1.8 Fail	2.9 Fail
1.3 Fail	—	1.2 Fail	2.4 Fail	3.7 AA Large
1.0 Fail	1.2 Fail	—	1.9 Fail	3.1 AA Large
1.8 Fail	2.4 Fail	1.9 Fail	—	1.6 Fail
2.9 Fail	3.7 AA Large	3.1 AA Large	1.6 Fail	—

White BG

1.4Fail

1.1Fail

1.4Fail

2.7Fail

4.2AA Large

Black BG

14.6AAA

18.6AAA

15.3AAA

7.9AAA

5.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CACBD2

F1F1D4

DEDEAD

AAAA6B

7D7D79

Deuteranopia

C8C5D3

F0F0D7

DEDEB1

ABAD6F

7E7E79

Tritanopia

BCD6D7

EDDCDE

DCBABD

B3787A

807979

Achromatopsia

D3D3D3

EEEEEE

D8D8D8

9C9C9C

7C7C7C

Shades & Tints Shades & Tints

#BAE0CE

Dark

Light

#EDF6C9

Dark

Light

#DCE19D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bae0ce;
  --color-2: #edf6c9;
  --color-3: #dce19d;
  --color-4: #b49d5b;
  --color-5: #807a79;
}

SCSS

$color-1: #bae0ce;
$color-2: #edf6c9;
$color-3: #dce19d;
$color-4: #b49d5b;
$color-5: #807a79;

TAILWIND

colors: {
  'brand-1': '#bae0ce',
  'brand-2': '#edf6c9',
  'brand-3': '#dce19d',
  'brand-4': '#b49d5b',
  'brand-5': '#807a79',
}

RGB Array

[186, 224, 206], [237, 246, 201], [220, 225, 157], [180, 157, 91], [128, 122, 121]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BAE0CE, #EDF6C9, #DCE19D, #B49D5B, #807A79 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: #bae0ce; --color-2: #edf6c9; --color-3: #dce19d; --color-4: #b49d5b; --color-5: #807a79. 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