← Back to Editor

#F9FBFA · #692E30 · #7D2024 · #39393B · #000004

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

#F9FBFA

Jade · Snow · Mint Green

HEX
#F9FBFA
RGB
rgb(249, 251, 250)
HSL
hsl(150, 20%, 98%)
HSB
hsb(150, 1%, 98%)
CMYK
cmyk(1%, 0%, 0%, 2%)
Oklch
oklch(98.6% 0.002 165.1)

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

#692E30

Crimson · Brown · Wine Red

HEX
#692E30
RGB
rgb(105, 46, 48)
HSL
hsl(358, 39%, 30%)
HSB
hsb(358, 56%, 41%)
CMYK
cmyk(0%, 56%, 54%, 59%)
Oklch
oklch(38.3% 0.085 19.8)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

#7D2024

Crimson · Brown · Wine Red

HEX
#7D2024
RGB
rgb(125, 32, 36)
HSL
hsl(357, 59%, 31%)
HSB
hsb(357, 74%, 49%)
CMYK
cmyk(0%, 74%, 71%, 51%)
Oklch
oklch(39.6% 0.127 23.0)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

#39393B

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#39393B
RGB
rgb(57, 57, 59)
HSL
hsl(240, 2%, 23%)
HSB
hsb(240, 3%, 23%)
CMYK
cmyk(3%, 3%, 0%, 77%)
Oklch
oklch(34.5% 0.003 286.2)

Traditional「Dark Cyan」· Paint「Dark Stone」· Creative Midnight Shadow

#000004

Deep Indigo · Black · Deep Sea Blue

HEX
#000004
RGB
rgb(0, 0, 4)
HSL
hsl(240, 100%, 1%)
HSB
hsb(240, 100%, 2%)
CMYK
cmyk(100%, 100%, 0%, 98%)
Oklch
oklch(4.8% 0.033 264.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F9FBFA
FBF9FA

Analogous

F9FBF9
F9FBFA
F9FBFB

Triadic

F9FBFA
FAF9FB
FBFAF9

Split-Comp.

F9FBFA
FBF9FB
FBF9F9

Tetradic

F9FBFA
F9F9FB
FBF9FA
FBFBF9

Contrast Matrix WCAG 2.1 Contrast

F9FBFA
692E30
7D2024
39393B
000004
—
9.9
AAA
9.6
AAA
11.1
AAA
20.2
AAA
9.9
AAA
—
1.0
Fail
1.1
Fail
2.0
Fail
9.6
AAA
1.0
Fail
—
1.2
Fail
2.1
Fail
11.1
AAA
1.1
Fail
1.2
Fail
—
1.8
Fail
20.2
AAA
2.0
Fail
2.1
Fail
1.8
Fail
—
White BG
1.0Fail
10.3AAA
10.0AAA
11.5AAA
21.0AAA
Black BG
20.2AAA
2.0Fail
2.1Fail
1.8Fail
1.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

FAFAFA
4F4F30
555423
39393B
000003

Deuteranopia

FAFAFA
53572F
5A6123
39393A
000003

Tritanopia

F9FAFA
662F2F
782222
393A3A
000202

Achromatopsia

FAFAFA
404040
3C3C3C
393939
000000

Shades & Tints Shades & Tints

#F9FBFA

Dark
Light

#692E30

Dark
Light

#7D2024

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f9fbfa;
  --color-2: #692e30;
  --color-3: #7d2024;
  --color-4: #39393b;
  --color-5: #000004;
}

SCSS

$color-1: #f9fbfa;
$color-2: #692e30;
$color-3: #7d2024;
$color-4: #39393b;
$color-5: #000004;

TAILWIND

colors: {
  'brand-1': '#f9fbfa',
  'brand-2': '#692e30',
  'brand-3': '#7d2024',
  'brand-4': '#39393b',
  'brand-5': '#000004',
}

RGB Array

[249, 251, 250], [105, 46, 48], [125, 32, 36], [57, 57, 59], [0, 0, 4]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #F9FBFA, #692E30, #7D2024, #39393B, #000004 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: #f9fbfa; --color-2: #692e30; --color-3: #7d2024; --color-4: #39393b; --color-5: #000004. 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