#E6F0DF + #E3C56A + #CDE7D0 + #B2DAC6 + #97C1B1 · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E6F0DF

Celadon · Beige · Mint Green

HEX

#E6F0DF

RGB

rgb(230, 240, 223)

HSL

hsl(95, 36%, 91%)

HSB

hsb(95, 7%, 94%)

CMYK

cmyk(4%, 0%, 7%, 6%)

Oklch

oklch(94.3% 0.025 132.1)

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

#E3C56A

Ginger · BurlyWood · Sunflower

HEX

#E3C56A

RGB

rgb(227, 197, 106)

HSL

hsl(45, 68%, 65%)

HSB

hsb(45, 53%, 89%)

CMYK

cmyk(0%, 13%, 53%, 11%)

Oklch

oklch(83.1% 0.116 91.5)

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

#CDE7D0

Celadon · LightGray · Mint Green

HEX

#CDE7D0

RGB

rgb(205, 231, 208)

HSL

hsl(127, 35%, 85%)

HSB

hsb(127, 11%, 91%)

CMYK

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

Oklch

oklch(90.3% 0.041 148.5)

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

#B2DAC6

Jade · Silver · Apple Green

HEX

#B2DAC6

RGB

rgb(178, 218, 198)

HSL

hsl(150, 35%, 78%)

HSB

hsb(150, 18%, 85%)

CMYK

cmyk(18%, 0%, 9%, 15%)

Oklch

oklch(85.4% 0.050 163.5)

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

#97C1B1

Jade · DarkGray · Apple Green

HEX

#97C1B1

RGB

rgb(151, 193, 177)

HSL

hsl(157, 25%, 67%)

HSB

hsb(157, 22%, 76%)

CMYK

cmyk(22%, 0%, 8%, 24%)

Oklch

oklch(77.6% 0.050 169.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E6F0DF

E9E0F0

Analogous

EFF0E0

E6F0DF

E0F0E1

Triadic

E6F0DF

E0E7F0

F0E0E7

Split-Comp.

E6F0DF

E1E0F0

F0E0EF

Tetradic

E6F0DF

E0EFF0

E9E0F0

F0E1E0

Contrast Matrix WCAG 2.1 Contrast

E6F0DF	E3C56A	CDE7D0	B2DAC6	97C1B1
—	1.4 Fail	1.1 Fail	1.3 Fail	1.7 Fail
1.4 Fail	—	1.3 Fail	1.1 Fail	1.2 Fail
1.1 Fail	1.3 Fail	—	1.2 Fail	1.5 Fail
1.3 Fail	1.1 Fail	1.2 Fail	—	1.3 Fail
1.7 Fail	1.2 Fail	1.5 Fail	1.3 Fail	—

White BG

1.2Fail

1.7Fail

1.3Fail

1.5Fail

2.0Fail

Black BG

17.9AAA

12.5AAA

15.9AAA

13.7AAA

10.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

EAEAE3

D6D680

D8D8D6

C3C4CB

A9AAB5

Deuteranopia

EAE9E4

D8DA85

D7D5D7

C1BECC

A7A4B6

Tritanopia

E7E6E7

E19195

CEDADB

B4CFD0

99B8B9

Achromatopsia

EBEBEB

C4C4C4

DDDDDD

CCCCCC

B3B3B3

Shades & Tints Shades & Tints

#E6F0DF

Dark

Light

#E3C56A

Dark

Light

#CDE7D0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e6f0df;
  --color-2: #e3c56a;
  --color-3: #cde7d0;
  --color-4: #b2dac6;
  --color-5: #97c1b1;
}

SCSS

$color-1: #e6f0df;
$color-2: #e3c56a;
$color-3: #cde7d0;
$color-4: #b2dac6;
$color-5: #97c1b1;

TAILWIND

colors: {
  'brand-1': '#e6f0df',
  'brand-2': '#e3c56a',
  'brand-3': '#cde7d0',
  'brand-4': '#b2dac6',
  'brand-5': '#97c1b1',
}

RGB Array

[230, 240, 223], [227, 197, 106], [205, 231, 208], [178, 218, 198], [151, 193, 177]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #E6F0DF, #E3C56A, #CDE7D0, #B2DAC6, #97C1B1 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: #e6f0df; --color-2: #e3c56a; --color-3: #cde7d0; --color-4: #b2dac6; --color-5: #97c1b1. 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 cool-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