#EBFAF9 + #DBF3F1 + #C9F3F0 + #BBEEEA + #ADE7E2 · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#EBFAF9

Jade · Snow · Glacier Blue

HEX

#EBFAF9

RGB

rgb(235, 250, 249)

HSL

hsl(176, 60%, 95%)

HSB

hsb(176, 6%, 98%)

CMYK

cmyk(6%, 0%, 0%, 2%)

Oklch

oklch(97.4% 0.016 192.1)

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

#DBF3F1

Jade · Lavender · Glacier Blue

HEX

#DBF3F1

RGB

rgb(219, 243, 241)

HSL

hsl(175, 50%, 91%)

HSB

hsb(175, 10%, 95%)

CMYK

cmyk(10%, 0%, 1%, 5%)

Oklch

oklch(94.6% 0.025 190.7)

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

#C9F3F0

Jade · Lavender · Glacier Blue

HEX

#C9F3F0

RGB

rgb(201, 243, 240)

HSL

hsl(176, 64%, 87%)

HSB

hsb(176, 17%, 95%)

CMYK

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

Oklch

oklch(93.4% 0.043 191.1)

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

#BBEEEA

Jade · LightBlue · Glacier Blue

HEX

#BBEEEA

RGB

rgb(187, 238, 234)

HSL

hsl(175, 60%, 83%)

HSB

hsb(175, 21%, 93%)

CMYK

cmyk(21%, 0%, 2%, 7%)

Oklch

oklch(91.3% 0.052 190.3)

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

#ADE7E2

Jade · LightBlue · Glacier Blue

HEX

#ADE7E2

RGB

rgb(173, 231, 226)

HSL

hsl(175, 55%, 79%)

HSB

hsb(175, 25%, 91%)

CMYK

cmyk(25%, 0%, 2%, 9%)

Oklch

oklch(88.7% 0.059 189.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EBFAF9

FAEBEC

Analogous

EBFAF1

EBFAF9

EBF3FA

Triadic

EBFAF9

F9EBFA

FAF9EB

Split-Comp.

EBFAF9

FAEBF3

FAF1EB

Tetradic

EBFAF9

F1EBFA

FAEBEC

F3FAEB

Contrast Matrix WCAG 2.1 Contrast

EBFAF9	DBF3F1	C9F3F0	BBEEEA	ADE7E2
—	1.1 Fail	1.1 Fail	1.2 Fail	1.3 Fail
1.1 Fail	—	1.0 Fail	1.1 Fail	1.2 Fail
1.1 Fail	1.0 Fail	—	1.1 Fail	1.1 Fail
1.2 Fail	1.1 Fail	1.1 Fail	—	1.1 Fail
1.3 Fail	1.2 Fail	1.1 Fail	1.1 Fail	—

White BG

1.1Fail

1.2Fail

1.3Fail

1.4Fail

Black BG

19.6AAA

18.1AAA

17.6AAA

16.5AAA

15.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F1F2F9

E5E6F1

DBDCF1

D1D2EB

C6C7E3

Deuteranopia

F1F0F9

E4E2F2

D9D6F1

CECAEB

C3BEE4

Tritanopia

ECF9F9

DCF2F2

CBF1F1

BEECEC

B0E4E4

Achromatopsia

F5F5F5

ECECEC

E6E6E6

DEDEDE

D5D5D5

Shades & Tints Shades & Tints

#EBFAF9

Dark

Light

#DBF3F1

Dark

Light

#C9F3F0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ebfaf9;
  --color-2: #dbf3f1;
  --color-3: #c9f3f0;
  --color-4: #bbeeea;
  --color-5: #ade7e2;
}

SCSS

$color-1: #ebfaf9;
$color-2: #dbf3f1;
$color-3: #c9f3f0;
$color-4: #bbeeea;
$color-5: #ade7e2;

TAILWIND

colors: {
  'brand-1': '#ebfaf9',
  'brand-2': '#dbf3f1',
  'brand-3': '#c9f3f0',
  'brand-4': '#bbeeea',
  'brand-5': '#ade7e2',
}

RGB Array

[235, 250, 249], [219, 243, 241], [201, 243, 240], [187, 238, 234], [173, 231, 226]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #EBFAF9, #DBF3F1, #C9F3F0, #BBEEEA, #ADE7E2 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: #ebfaf9; --color-2: #dbf3f1; --color-3: #c9f3f0; --color-4: #bbeeea; --color-5: #ade7e2. 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