#CADEE1 + #75B9BF + #75A6BF + #7594BF + #7581BF · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#CADEE1

Sky Blue · LightGray · Glacier Blue

HEX

#CADEE1

RGB

rgb(202, 222, 225)

HSL

hsl(188, 28%, 84%)

HSB

hsb(188, 10%, 88%)

CMYK

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

Oklch

oklch(88.7% 0.022 207.6)

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

#75B9BF

Slate Blue · MediumAquaMarine · Lake Green

HEX

#75B9BF

RGB

rgb(117, 185, 191)

HSL

hsl(185, 37%, 60%)

HSB

hsb(185, 39%, 75%)

CMYK

cmyk(39%, 3%, 0%, 25%)

Oklch

oklch(74.3% 0.069 202.9)

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

#75A6BF

Slate Blue · CadetBlue · Navy Blue

HEX

#75A6BF

RGB

rgb(117, 166, 191)

HSL

hsl(200, 37%, 60%)

HSB

hsb(200, 39%, 75%)

CMYK

cmyk(39%, 13%, 0%, 25%)

Oklch

oklch(69.9% 0.064 231.0)

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

#7594BF

Azure · CadetBlue · Navy Blue

HEX

#7594BF

RGB

rgb(117, 148, 191)

HSL

hsl(215, 37%, 60%)

HSB

hsb(215, 39%, 75%)

CMYK

cmyk(39%, 23%, 0%, 25%)

Oklch

oklch(66.0% 0.073 256.7)

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

#7581BF

Azure · LightSlateGray · Navy Blue

HEX

#7581BF

RGB

rgb(117, 129, 191)

HSL

hsl(230, 37%, 60%)

HSB

hsb(230, 39%, 75%)

CMYK

cmyk(39%, 32%, 0%, 25%)

Oklch

oklch(61.9% 0.095 274.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CADEE1

E2CECB

Analogous

CBE2D9

CADEE1

CBD3E2

Triadic

CADEE1

E2CBDF

DFE2CB

Split-Comp.

CADEE1

E2CBD3

E2D9CB

Tetradic

CADEE1

D9CBE2

E2CECB

D3E2CB

Contrast Matrix WCAG 2.1 Contrast

CADEE1	75B9BF	75A6BF	7594BF	7581BF
—	1.6 Fail	1.9 Fail	2.2 Fail	2.7 Fail
1.6 Fail	—	1.2 Fail	1.4 Fail	1.7 Fail
1.9 Fail	1.2 Fail	—	1.2 Fail	1.4 Fail
2.2 Fail	1.4 Fail	1.2 Fail	—	1.2 Fail
2.7 Fail	1.7 Fail	1.4 Fail	1.2 Fail	—

White BG

1.4Fail

2.2Fail

2.6Fail

3.1AA Large

3.7AA Large

Black BG

15.0AAA

9.4AAA

8.0AAA

6.7AA

5.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D3D3E0

9293BE

8A8BB9

8283B5

7A7AB0

Deuteranopia

D2D0E0

8F89BD

8784B8

817EB2

7A79AC

Tritanopia

CBE0E0

78BCBC

77B4B3

77ACAB

76A4A2

Achromatopsia

D8D8D8

A5A5A5

9A9A9A

909090

848484

Shades & Tints Shades & Tints

#CADEE1

Dark

Light

#75B9BF

Dark

Light

#75A6BF

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cadee1;
  --color-2: #75b9bf;
  --color-3: #75a6bf;
  --color-4: #7594bf;
  --color-5: #7581bf;
}

SCSS

$color-1: #cadee1;
$color-2: #75b9bf;
$color-3: #75a6bf;
$color-4: #7594bf;
$color-5: #7581bf;

TAILWIND

colors: {
  'brand-1': '#cadee1',
  'brand-2': '#75b9bf',
  'brand-3': '#75a6bf',
  'brand-4': '#7594bf',
  'brand-5': '#7581bf',
}

RGB Array

[202, 222, 225], [117, 185, 191], [117, 166, 191], [117, 148, 191], [117, 129, 191]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #CADEE1, #75B9BF, #75A6BF, #7594BF, #7581BF is ideal for: corporate websites, product showcases, portfolios. 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: #cadee1; --color-2: #75b9bf; --color-3: #75a6bf; --color-4: #7594bf; --color-5: #7581bf. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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