← Back to Editor

#CBFCE9 · #9AF3F1 · #69D9EF · #32B1E8 · #0585D0

cool

A 5-color cool palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#CBFCE9

Jade · Lavender · Mint Green

HEX
#CBFCE9
RGB
rgb(203, 252, 233)
HSL
hsl(157, 89%, 89%)
HSB
hsb(157, 19%, 99%)
CMYK
cmyk(19%, 0%, 8%, 1%)
Oklch
oklch(95.2% 0.056 169.5)

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

#9AF3F1

Jade · LightBlue · Glacier Blue

HEX
#9AF3F1
RGB
rgb(154, 243, 241)
HSL
hsl(179, 79%, 78%)
HSB
hsb(179, 37%, 95%)
CMYK
cmyk(37%, 0%, 1%, 5%)
Oklch
oklch(90.8% 0.086 193.9)

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

#69D9EF

Sky Blue · SkyBlue · Lake Green

HEX
#69D9EF
RGB
rgb(105, 217, 239)
HSL
hsl(190, 81%, 67%)
HSB
hsb(190, 56%, 94%)
CMYK
cmyk(56%, 9%, 0%, 6%)
Oklch
oklch(82.8% 0.106 212.3)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#32B1E8

Lake Blue · DodgerBlue · Lake Green

HEX
#32B1E8
RGB
rgb(50, 177, 232)
HSL
hsl(198, 80%, 55%)
HSB
hsb(198, 78%, 91%)
CMYK
cmyk(78%, 24%, 0%, 9%)
Oklch
oklch(71.7% 0.132 232.2)

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

#0585D0

Lake Blue · DodgerBlue · Navy Blue

HEX
#0585D0
RGB
rgb(5, 133, 208)
HSL
hsl(202, 95%, 42%)
HSB
hsb(202, 98%, 82%)
CMYK
cmyk(98%, 36%, 0%, 18%)
Oklch
oklch(59.5% 0.148 244.8)

Traditional「Lake Blue」· Paint「Navy Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CBFCE9
FCCADD

Analogous

CAFCD0
CBFCE9
CAF6FC

Triadic

CBFCE9
E9CAFC
FCE9CA

Split-Comp.

CBFCE9
FCCAF6
FCD0CA

Tetradic

CBFCE9
D0CAFC
FCCADD
F6FCCA

Contrast Matrix WCAG 2.1 Contrast

CBFCE9
9AF3F1
69D9EF
32B1E8
0585D0
—
1.1
Fail
1.5
Fail
2.2
Fail
3.5
AA Large
1.1
Fail
—
1.3
Fail
1.9
Fail
3.1
AA Large
1.5
Fail
1.3
Fail
—
1.5
Fail
2.4
Fail
2.2
Fail
1.9
Fail
1.5
Fail
—
1.6
Fail
3.5
AA Large
3.1
AA Large
2.4
Fail
1.6
Fail
—
White BG
1.1Fail
1.3Fail
1.6Fail
2.4Fail
4.0AA Large
Black BG
18.6AAA
16.5AAA
12.8AAA
8.6AAA
5.3AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E0E1EE
C1C1F1
999BEA
696ADB
3C3EBE

Deuteranopia

DDDAEF
BBB5F2
938BE8
6258D7
352BBA

Tritanopia

CDF1F2
9EF2F2
6FE5E5
38D0CE
0BB0AC

Achromatopsia

EBEBEB
D8D8D8
BABABA
919191
676767

Shades & Tints Shades & Tints

#CBFCE9

Dark
Light

#9AF3F1

Dark
Light

#69D9EF

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cbfce9;
  --color-2: #9af3f1;
  --color-3: #69d9ef;
  --color-4: #32b1e8;
  --color-5: #0585d0;
}

SCSS

$color-1: #cbfce9;
$color-2: #9af3f1;
$color-3: #69d9ef;
$color-4: #32b1e8;
$color-5: #0585d0;

TAILWIND

colors: {
  'brand-1': '#cbfce9',
  'brand-2': '#9af3f1',
  'brand-3': '#69d9ef',
  'brand-4': '#32b1e8',
  'brand-5': '#0585d0',
}

RGB Array

[203, 252, 233], [154, 243, 241], [105, 217, 239], [50, 177, 232], [5, 133, 208]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #CBFCE9, #9AF3F1, #69D9EF, #32B1E8, #0585D0 is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #cbfce9; --color-2: #9af3f1; --color-3: #69d9ef; --color-4: #32b1e8; --color-5: #0585d0. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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