#E6F2C4 + #D4E0BA + #BECBB1 + #A5C5B0 + #98BDAC - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E6F2C4

Willow Green · Beige · Mint Green

HEX

#E6F2C4

RGB

rgb(230, 242, 196)

HSL

hsl(76, 64%, 86%)

HSB

hsb(76, 19%, 95%)

CMYK

cmyk(5%, 0%, 19%, 5%)

Oklch

oklch(94.1% 0.062 119.5)

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

#D4E0BA

Willow Green · LightGray · Apple Green

HEX

#D4E0BA

RGB

rgb(212, 224, 186)

HSL

hsl(79, 38%, 80%)

HSB

hsb(79, 17%, 88%)

CMYK

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

Oklch

oklch(88.8% 0.052 121.7)

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

#BECBB1

Celadon · Silver · Apple Green

HEX

#BECBB1

RGB

rgb(190, 203, 177)

HSL

hsl(90, 20%, 75%)

HSB

hsb(90, 13%, 80%)

CMYK

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

Oklch

oklch(82.5% 0.038 129.0)

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

#A5C5B0

Celadon · DarkGray · Apple Green

HEX

#A5C5B0

RGB

rgb(165, 197, 176)

HSL

hsl(141, 22%, 71%)

HSB

hsb(141, 16%, 77%)

CMYK

cmyk(16%, 0%, 11%, 23%)

Oklch

oklch(79.4% 0.045 156.5)

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

#98BDAC

Jade · DarkGray · Apple Green

HEX

#98BDAC

RGB

rgb(152, 189, 172)

HSL

hsl(152, 22%, 67%)

HSB

hsb(152, 20%, 74%)

CMYK

cmyk(20%, 0%, 9%, 26%)

Oklch

oklch(76.6% 0.047 165.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E6F2C4

D1C4F2

Analogous

F2E7C4

E6F2C4

CFF2C4

Triadic

E6F2C4

C4E6F2

F2C4E6

Split-Comp.

E6F2C4

C4CFF2

E7C4F2

Tetradic

E6F2C4

C4F2E7

D1C4F2

F2C4CF

Contrast Matrix WCAG 2.1 Contrast

E6F2C4	D4E0BA	BECBB1	A5C5B0	98BDAC
—	1.2 Fail	1.4 Fail	1.6 Fail	1.7 Fail
1.2 Fail	—	1.2 Fail	1.4 Fail	1.5 Fail
1.4 Fail	1.2 Fail	—	1.1 Fail	1.2 Fail
1.6 Fail	1.4 Fail	1.1 Fail	—	1.1 Fail
1.7 Fail	1.5 Fail	1.2 Fail	1.1 Fail	—

White BG

1.2Fail

1.4Fail

1.7Fail

1.9Fail

2.1Fail

Black BG

17.9AAA

15.2AAA

12.4AAA

11.2AAA

10.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EBEBCF

D9D9C3

C4C4B7

B3B3B5

A8A8B0

Deuteranopia

EBEAD2

D9D8C5

C3C2B9

B1AFB6

A6A3B1

Tritanopia

E7D8DA

D5CACC

BFBCBD

A7B9BA

9AB3B4

Achromatopsia

E9E9E9

D8D8D8

C4C4C4

B9B9B9

B0B0B0

Shades & Tints Shades & Tints

#E6F2C4

Dark

Light

#D4E0BA

Dark

Light

#BECBB1

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e6f2c4;
  --color-2: #d4e0ba;
  --color-3: #becbb1;
  --color-4: #a5c5b0;
  --color-5: #98bdac;
}

SCSS

$color-1: #e6f2c4;
$color-2: #d4e0ba;
$color-3: #becbb1;
$color-4: #a5c5b0;
$color-5: #98bdac;

TAILWIND

colors: {
  'brand-1': '#e6f2c4',
  'brand-2': '#d4e0ba',
  'brand-3': '#becbb1',
  'brand-4': '#a5c5b0',
  'brand-5': '#98bdac',
}

RGB Array

[230, 242, 196], [212, 224, 186], [190, 203, 177], [165, 197, 176], [152, 189, 172]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E6F2C4, #D4E0BA, #BECBB1, #A5C5B0, #98BDAC 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: #e6f2c4; --color-2: #d4e0ba; --color-3: #becbb1; --color-4: #a5c5b0; --color-5: #98bdac. 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