← Back to Editor

#16181A · #262E53 · #1B5195 · #1696D8 · #65C7FD

cool

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#16181A

Indigo · Black · Jet Black

HEX
#16181A
RGB
rgb(22, 24, 26)
HSL
hsl(210, 8%, 9%)
HSB
hsb(210, 15%, 10%)
CMYK
cmyk(15%, 8%, 0%, 90%)
Oklch
oklch(20.8% 0.005 248.1)

Traditional「Indigo」· Paint「Jet Black」· Creative Midnight Shadow

#262E53

Indigo · DarkSlateGray · Prussian Blue

HEX
#262E53
RGB
rgb(38, 46, 83)
HSL
hsl(229, 37%, 24%)
HSB
hsb(229, 54%, 33%)
CMYK
cmyk(54%, 45%, 0%, 67%)
Oklch
oklch(31.4% 0.067 272.8)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#1B5195

Indigo · DarkSlateBlue · Prussian Blue

HEX
#1B5195
RGB
rgb(27, 81, 149)
HSL
hsl(213, 69%, 35%)
HSB
hsb(213, 82%, 58%)
CMYK
cmyk(82%, 46%, 0%, 42%)
Oklch
oklch(43.8% 0.125 256.2)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#1696D8

Lake Blue · DodgerBlue · Navy Blue

HEX
#1696D8
RGB
rgb(22, 150, 216)
HSL
hsl(200, 82%, 47%)
HSB
hsb(200, 90%, 85%)
CMYK
cmyk(90%, 31%, 0%, 15%)
Oklch
oklch(64.1% 0.140 239.4)

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

#65C7FD

Sky Blue · LightSkyBlue · Cobalt Blue

HEX
#65C7FD
RGB
rgb(101, 199, 253)
HSL
hsl(201, 97%, 69%)
HSB
hsb(201, 60%, 99%)
CMYK
cmyk(60%, 21%, 0%, 1%)
Oklch
oklch(79.2% 0.120 235.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

16181A
191715

Analogous

151919
16181A
151519

Triadic

16181A
191517
171915

Split-Comp.

16181A
191515
191915

Tetradic

16181A
191519
191715
151915

Contrast Matrix WCAG 2.1 Contrast

16181A
262E53
1B5195
1696D8
65C7FD
—
1.4
Fail
2.3
Fail
5.4
AA
9.4
AAA
1.4
Fail
—
1.7
Fail
4.0
AA Large
7.0
AA
2.3
Fail
1.7
Fail
—
2.4
Fail
4.2
AA Large
5.4
AA
4.0
AA Large
2.4
Fail
—
1.7
Fail
9.4
AAA
7.0
AA
4.2
AA Large
1.7
Fail
—
White BG
17.8AAA
13.1AAA
7.9AAA
3.3AA Large
1.9Fail
Black BG
1.2Fail
1.6Fail
2.7Fail
6.4AA
11.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

17171A
292A4A
323385
4D4FC8
8F90F0

Deuteranopia

171719
292848
2F2B81
463CC4
8A82ED

Tritanopia

161919
264341
1E7875
1CBBB9
6AE6E3

Achromatopsia

181818
303030
494949
777777
B0B0B0

Shades & Tints Shades & Tints

#16181A

Dark
Light

#262E53

Dark
Light

#1B5195

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #16181a;
  --color-2: #262e53;
  --color-3: #1b5195;
  --color-4: #1696d8;
  --color-5: #65c7fd;
}

SCSS

$color-1: #16181a;
$color-2: #262e53;
$color-3: #1b5195;
$color-4: #1696d8;
$color-5: #65c7fd;

TAILWIND

colors: {
  'brand-1': '#16181a',
  'brand-2': '#262e53',
  'brand-3': '#1b5195',
  'brand-4': '#1696d8',
  'brand-5': '#65c7fd',
}

RGB Array

[22, 24, 26], [38, 46, 83], [27, 81, 149], [22, 150, 216], [101, 199, 253]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #16181A, #262E53, #1B5195, #1696D8, #65C7FD is ideal for: tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #16181a; --color-2: #262e53; --color-3: #1b5195; --color-4: #1696d8; --color-5: #65c7fd. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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. 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