#BEE4AB + #DAE4A8 + #F2F1D0 + #BDE4AA + #E3EEB6 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#BEE4AB

Emerald · Silver · Apple Green

HEX

#BEE4AB

RGB

rgb(190, 228, 171)

HSL

hsl(100, 51%, 78%)

HSB

hsb(100, 25%, 89%)

CMYK

cmyk(17%, 0%, 25%, 11%)

Oklch

oklch(87.7% 0.086 135.4)

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

#DAE4A8

Willow Green · Wheat · Apple Green

HEX

#DAE4A8

RGB

rgb(218, 228, 168)

HSL

hsl(70, 53%, 78%)

HSB

hsb(70, 26%, 89%)

CMYK

cmyk(4%, 0%, 26%, 11%)

Oklch

oklch(89.7% 0.079 115.7)

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

#F2F1D0

Fresh Green · Beige · Lemon Cream

HEX

#F2F1D0

RGB

rgb(242, 241, 208)

HSL

hsl(58, 57%, 88%)

HSB

hsb(58, 14%, 95%)

CMYK

cmyk(0%, 0%, 14%, 5%)

Oklch

oklch(95.0% 0.043 105.8)

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

#BDE4AA

Emerald · Silver · Apple Green

HEX

#BDE4AA

RGB

rgb(189, 228, 170)

HSL

hsl(100, 52%, 78%)

HSB

hsb(100, 25%, 89%)

CMYK

cmyk(17%, 0%, 25%, 11%)

Oklch

oklch(87.6% 0.088 135.6)

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

#E3EEB6

Willow Green · Wheat · Mint Green

HEX

#E3EEB6

RGB

rgb(227, 238, 182)

HSL

hsl(72, 62%, 82%)

HSB

hsb(72, 24%, 93%)

CMYK

cmyk(5%, 0%, 24%, 7%)

Oklch

oklch(92.7% 0.074 116.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BEE4AB

D0AAE4

Analogous

DAE4AA

BEE4AB

AAE4B4

Triadic

BEE4AB

AABDE4

E4AABD

Split-Comp.

BEE4AB

B4AAE4

E4AADA

Tetradic

BEE4AB

AADAE4

D0AAE4

E4B4AA

Contrast Matrix WCAG 2.1 Contrast

BEE4AB	DAE4A8	F2F1D0	BDE4AA	E3EEB6
—	1.1 Fail	1.2 Fail	1.0 Fail	1.2 Fail
1.1 Fail	—	1.2 Fail	1.1 Fail	1.1 Fail
1.2 Fail	1.2 Fail	—	1.2 Fail	1.1 Fail
1.0 Fail	1.1 Fail	1.2 Fail	—	1.2 Fail
1.2 Fail	1.1 Fail	1.1 Fail	1.2 Fail	—

White BG

1.4Fail

1.3Fail

1.1Fail

1.4Fail

1.2Fail

Black BG

14.9AAA

15.6AAA

18.3AAA

14.8AAA

17.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CECFB9

DEDEB7

F2F2D8

CECEB8

E8E8C4

Deuteranopia

CCC9BC

DEDDBA

F2F2DA

CCC9BB

E7E6C7

Tritanopia

C0C4C6

DBC2C5

F2DEE0

BFC3C6

E4CED1

Achromatopsia

D2D2D2

DADADA

EEEEEE

D2D2D2

E4E4E4

Shades & Tints Shades & Tints

#BEE4AB

Dark

Light

#DAE4A8

Dark

Light

#F2F1D0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bee4ab;
  --color-2: #dae4a8;
  --color-3: #f2f1d0;
  --color-4: #bde4aa;
  --color-5: #e3eeb6;
}

SCSS

$color-1: #bee4ab;
$color-2: #dae4a8;
$color-3: #f2f1d0;
$color-4: #bde4aa;
$color-5: #e3eeb6;

TAILWIND

colors: {
  'brand-1': '#bee4ab',
  'brand-2': '#dae4a8',
  'brand-3': '#f2f1d0',
  'brand-4': '#bde4aa',
  'brand-5': '#e3eeb6',
}

RGB Array

[190, 228, 171], [218, 228, 168], [242, 241, 208], [189, 228, 170], [227, 238, 182]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BEE4AB, #DAE4A8, #F2F1D0, #BDE4AA, #E3EEB6 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: #bee4ab; --color-2: #dae4a8; --color-3: #f2f1d0; --color-4: #bde4aa; --color-5: #e3eeb6. 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