← Back to Editor

#17B3D1 · #594C42 · #A8A19C · #E2E0DE · #EDECEB

cool

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#17B3D1

Lake Blue · DarkTurquoise · Mint Ice

HEX
#17B3D1
RGB
rgb(23, 179, 209)
HSL
hsl(190, 80%, 45%)
HSB
hsb(190, 89%, 82%)
CMYK
cmyk(89%, 14%, 0%, 18%)
Oklch
oklch(70.7% 0.122 215.9)

Traditional「Lake Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#594C42

Tangerine · DarkOliveGreen · Amber Brown

HEX
#594C42
RGB
rgb(89, 76, 66)
HSL
hsl(26, 15%, 30%)
HSB
hsb(26, 26%, 35%)
CMYK
cmyk(0%, 15%, 26%, 65%)
Oklch
oklch(42.7% 0.024 59.7)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#A8A19C

Ash · DarkGray · Silver Sand

HEX
#A8A19C
RGB
rgb(168, 161, 156)
HSL
hsl(25, 6%, 64%)
HSB
hsb(25, 7%, 66%)
CMYK
cmyk(0%, 4%, 7%, 34%)
Oklch
oklch(71.3% 0.011 58.2)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#E2E0DE

Plain White · LightGray · Cloud White

HEX
#E2E0DE
RGB
rgb(226, 224, 222)
HSL
hsl(30, 6%, 88%)
HSB
hsb(30, 2%, 89%)
CMYK
cmyk(0%, 1%, 2%, 11%)
Oklch
oklch(90.8% 0.003 67.8)

Traditional「Plain White」· Paint「Cloud White」· Creative Silver Lining

#EDECEB

Plain White · Linen · Cloud White

HEX
#EDECEB
RGB
rgb(237, 236, 235)
HSL
hsl(30, 5%, 93%)
HSB
hsb(30, 1%, 93%)
CMYK
cmyk(0%, 0%, 1%, 7%)
Oklch
oklch(94.4% 0.002 67.8)

Traditional「Plain White」· Paint「Cloud White」· Creative Morning Mist

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

17B3D1
CF3617

Analogous

17CF91
17B3D1
1754CF

Triadic

17B3D1
CF17B0
B0CF17

Split-Comp.

17B3D1
CF1754
CF9117

Tetradic

17B3D1
9117CF
CF3617
54CF17

Contrast Matrix WCAG 2.1 Contrast

17B3D1
594C42
A8A19C
E2E0DE
EDECEB
—
3.3
AA Large
1.0
Fail
1.9
Fail
2.1
Fail
3.3
AA Large
—
3.2
AA Large
6.3
AA
7.0
AAA
1.0
Fail
3.2
AA Large
—
1.9
Fail
2.2
Fail
1.9
Fail
6.3
AA
1.9
Fail
—
1.1
Fail
2.1
Fail
7.0
AAA
2.2
Fail
1.1
Fail
—
White BG
2.5Fail
8.3AAA
2.5Fail
1.3Fail
1.2Fail
Black BG
8.4AAA
2.5Fail
8.2AAA
16.0AAA
17.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5B5CCA
535344
A5A59D
E1E1DE
EDEDEB

Deuteranopia

5246C8
545545
A5A69E
E1E1DF
EDEDEB

Tritanopia

1FC4C3
584647
A89E9E
E2DFDF
EDEBEB

Achromatopsia

888888
4F4F4F
A3A3A3
E0E0E0
ECECEC

Shades & Tints Shades & Tints

#17B3D1

Dark
Light

#594C42

Dark
Light

#A8A19C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #17b3d1;
  --color-2: #594c42;
  --color-3: #a8a19c;
  --color-4: #e2e0de;
  --color-5: #edeceb;
}

SCSS

$color-1: #17b3d1;
$color-2: #594c42;
$color-3: #a8a19c;
$color-4: #e2e0de;
$color-5: #edeceb;

TAILWIND

colors: {
  'brand-1': '#17b3d1',
  'brand-2': '#594c42',
  'brand-3': '#a8a19c',
  'brand-4': '#e2e0de',
  'brand-5': '#edeceb',
}

RGB Array

[23, 179, 209], [89, 76, 66], [168, 161, 156], [226, 224, 222], [237, 236, 235]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #17B3D1, #594C42, #A8A19C, #E2E0DE, #EDECEB is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #17b3d1; --color-2: #594c42; --color-3: #a8a19c; --color-4: #e2e0de; --color-5: #edeceb. 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. 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 tech, SaaS, healthcare, eco industries. Restrained colors convey professionalism and trust. 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