← Back to Editor

#292B37 · #FEFAFB · #426288 · #C8D3CB · #718397

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

#292B37

Indigo · DarkSlateGray · Deep Sea Blue

HEX
#292B37
RGB
rgb(41, 43, 55)
HSL
hsl(231, 15%, 19%)
HSB
hsb(231, 25%, 22%)
CMYK
cmyk(25%, 22%, 0%, 78%)
Oklch
oklch(29.2% 0.022 277.5)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#FEFAFB

Peach Pink · Snow · Cherry Blossom

HEX
#FEFAFB
RGB
rgb(254, 250, 251)
HSL
hsl(345, 67%, 99%)
HSB
hsb(345, 2%, 100%)
CMYK
cmyk(0%, 2%, 1%, 0%)
Oklch
oklch(98.8% 0.004 360.0)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#426288

Indigo · DarkSlateBlue · Prussian Blue

HEX
#426288
RGB
rgb(66, 98, 136)
HSL
hsl(213, 35%, 40%)
HSB
hsb(213, 51%, 53%)
CMYK
cmyk(51%, 28%, 0%, 47%)
Oklch
oklch(48.8% 0.072 253.4)

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

#C8D3CB

Celadon · LightGray · Mint Green

HEX
#C8D3CB
RGB
rgb(200, 211, 203)
HSL
hsl(136, 11%, 81%)
HSB
hsb(136, 5%, 83%)
CMYK
cmyk(5%, 0%, 4%, 17%)
Oklch
oklch(85.6% 0.016 154.4)

Traditional「Celadon」· Paint「Mint Green」· Creative Mint Breeze

#718397

Azure · SlateGray · Navy Blue

HEX
#718397
RGB
rgb(113, 131, 151)
HSL
hsl(212, 15%, 52%)
HSB
hsb(212, 25%, 59%)
CMYK
cmyk(25%, 13%, 0%, 41%)
Oklch
oklch(60.3% 0.037 251.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

292B37
383629

Analogous

293338
292B37
2E2938

Triadic

292B37
38292B
2B3829

Split-Comp.

292B37
382E29
333829

Tetradic

292B37
382933
383629
29382E

Contrast Matrix WCAG 2.1 Contrast

292B37
FEFAFB
426288
C8D3CB
718397
—
13.6
AAA
2.2
Fail
9.1
AAA
3.6
AA Large
13.6
AAA
—
6.1
AA
1.5
Fail
3.8
AA Large
2.2
Fail
6.1
AA
—
4.1
AA Large
1.6
Fail
9.1
AAA
1.5
Fail
4.1
AA Large
—
2.5
Fail
3.6
AA Large
3.8
AA Large
1.6
Fail
2.5
Fail
—
White BG
14.0AAA
1.0Fail
6.3AA
1.5Fail
3.9AA Large
Black BG
1.5Fail
20.3AAA
3.3AA Large
13.6AAA
5.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

2A2A34
FCFCFB
50507F
CDCDCD
797992

Deuteranopia

2A2A33
FDFDFB
4E4C7D
CCCBCD
787691

Tritanopia

293231
FEFBFB
447876
C9CECF
728E8E

Achromatopsia

2C2C2C
FBFBFB
5D5D5D
CFCFCF
808080

Shades & Tints Shades & Tints

#292B37

Dark
Light

#FEFAFB

Dark
Light

#426288

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #292b37;
  --color-2: #fefafb;
  --color-3: #426288;
  --color-4: #c8d3cb;
  --color-5: #718397;
}

SCSS

$color-1: #292b37;
$color-2: #fefafb;
$color-3: #426288;
$color-4: #c8d3cb;
$color-5: #718397;

TAILWIND

colors: {
  'brand-1': '#292b37',
  'brand-2': '#fefafb',
  'brand-3': '#426288',
  'brand-4': '#c8d3cb',
  'brand-5': '#718397',
}

RGB Array

[41, 43, 55], [254, 250, 251], [66, 98, 136], [200, 211, 203], [113, 131, 151]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #292B37, #FEFAFB, #426288, #C8D3CB, #718397 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: #292b37; --color-2: #fefafb; --color-3: #426288; --color-4: #c8d3cb; --color-5: #718397. 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