#C9D5EA + #CBE8E8 + #EEFDE5 + #A6E8CA + #54DFB6 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C9D5EA

Azure · LightGray · Sky Blue

HEX

#C9D5EA

RGB

rgb(201, 213, 234)

HSL

hsl(218, 44%, 85%)

HSB

hsb(218, 14%, 92%)

CMYK

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

Oklch

oklch(87.0% 0.032 261.7)

Traditional「Azure」· Paint「Sky Blue」· Creative Twilight Haze

#CBE8E8

Sky Blue · LightGray · Glacier Blue

HEX

#CBE8E8

RGB

rgb(203, 232, 232)

HSL

hsl(180, 39%, 85%)

HSB

hsb(180, 13%, 91%)

CMYK

cmyk(13%, 0%, 0%, 9%)

Oklch

oklch(91.0% 0.030 196.6)

Traditional「Sky Blue」· Paint「Glacier Blue」· Creative Arctic Pool

#EEFDE5

Emerald · Beige · Mint Green

HEX

#EEFDE5

RGB

rgb(238, 253, 229)

HSL

hsl(98, 86%, 95%)

HSB

hsb(98, 9%, 99%)

CMYK

cmyk(6%, 0%, 9%, 1%)

Oklch

oklch(97.7% 0.035 133.5)

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

#A6E8CA

Jade · LightBlue · Apple Green

HEX

#A6E8CA

RGB

rgb(166, 232, 202)

HSL

hsl(153, 59%, 78%)

HSB

hsb(153, 28%, 91%)

CMYK

cmyk(28%, 0%, 13%, 9%)

Oklch

oklch(87.8% 0.079 164.8)

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

#54DFB6

Mineral Blue · MediumAquaMarine · Lake Green

HEX

#54DFB6

RGB

rgb(84, 223, 182)

HSL

hsl(162, 68%, 60%)

HSB

hsb(162, 62%, 87%)

CMYK

cmyk(62%, 0%, 18%, 13%)

Oklch

oklch(81.7% 0.134 170.0)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C9D5EA

EADDC8

Analogous

C8E5EA

C9D5EA

CCC8EA

Triadic

C9D5EA

EAC8D4

D4EAC8

Split-Comp.

C9D5EA

EACCC8

E5EAC8

Tetradic

C9D5EA

EAC8E5

EADDC8

C8EACC

Contrast Matrix WCAG 2.1 Contrast

C9D5EA	CBE8E8	EEFDE5	A6E8CA	54DFB6
—	1.1 Fail	1.4 Fail	1.1 Fail	1.1 Fail
1.1 Fail	—	1.2 Fail	1.1 Fail	1.3 Fail
1.4 Fail	1.2 Fail	—	1.3 Fail	1.6 Fail
1.1 Fail	1.1 Fail	1.3 Fail	—	1.2 Fail
1.1 Fail	1.3 Fail	1.6 Fail	1.2 Fail	—

White BG

1.5Fail

1.3Fail

1.1Fail

1.4Fail

1.7Fail

Black BG

14.2AAA

16.2AAA

19.8AAA

15.0AAA

12.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CECEE5

D8D8E8

F4F5EB

C3C3D1

9091C0

Deuteranopia

CECDE4

D6D4E8

F4F3EC

BFBAD3

887EC2

Tritanopia

CAE1E0

CCE8E8

EFEFF0

A9D7D8

5BC8C9

Achromatopsia

D4D4D4

DFDFDF

F6F6F6

D1D1D1

B1B1B1

Shades & Tints Shades & Tints

#C9D5EA

Dark

Light

#CBE8E8

Dark

Light

#EEFDE5

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c9d5ea;
  --color-2: #cbe8e8;
  --color-3: #eefde5;
  --color-4: #a6e8ca;
  --color-5: #54dfb6;
}

SCSS

$color-1: #c9d5ea;
$color-2: #cbe8e8;
$color-3: #eefde5;
$color-4: #a6e8ca;
$color-5: #54dfb6;

TAILWIND

colors: {
  'brand-1': '#c9d5ea',
  'brand-2': '#cbe8e8',
  'brand-3': '#eefde5',
  'brand-4': '#a6e8ca',
  'brand-5': '#54dfb6',
}

RGB Array

[201, 213, 234], [203, 232, 232], [238, 253, 229], [166, 232, 202], [84, 223, 182]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C9D5EA, #CBE8E8, #EEFDE5, #A6E8CA, #54DFB6 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: #c9d5ea; --color-2: #cbe8e8; --color-3: #eefde5; --color-4: #a6e8ca; --color-5: #54dfb6. 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