← Back to Editor

#5D000A · #DCDCDA · #C1C2C4 · #00555E · #B0B4B3

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

#5D000A

Vermilion · Maroon · Deep Berry

HEX
#5D000A
RGB
rgb(93, 0, 10)
HSL
hsl(354, 100%, 18%)
HSB
hsb(354, 100%, 36%)
CMYK
cmyk(0%, 100%, 89%, 64%)
Oklch
oklch(30.1% 0.122 24.5)

Traditional「Vermilion」· Paint「Deep Berry」· Creative Blush Sunrise

#DCDCDA

Plain White · LightGray · Cloud White

HEX
#DCDCDA
RGB
rgb(220, 220, 218)
HSL
hsl(60, 3%, 86%)
HSB
hsb(60, 1%, 86%)
CMYK
cmyk(0%, 0%, 1%, 14%)
Oklch
oklch(89.4% 0.003 106.5)

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

#C1C2C4

Silver Gray · Silver · Pearl Gray

HEX
#C1C2C4
RGB
rgb(193, 194, 196)
HSL
hsl(220, 2%, 76%)
HSB
hsb(220, 2%, 77%)
CMYK
cmyk(2%, 1%, 0%, 23%)
Oklch
oklch(81.4% 0.003 264.5)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

#00555E

Lake Blue · DarkSlateGray · Peacock Green

HEX
#00555E
RGB
rgb(0, 85, 94)
HSL
hsl(186, 100%, 18%)
HSB
hsb(186, 100%, 37%)
CMYK
cmyk(100%, 10%, 0%, 63%)
Oklch
oklch(41.1% 0.070 207.2)

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

#B0B4B3

Ash · DarkGray · Silver Sand

HEX
#B0B4B3
RGB
rgb(176, 180, 179)
HSL
hsl(165, 3%, 70%)
HSB
hsb(165, 2%, 71%)
CMYK
cmyk(2%, 0%, 1%, 29%)
Oklch
oklch(76.6% 0.005 179.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5D000A
005C53

Analogous

5C0037
5D000A
5C2500

Triadic

5D000A
095C00
00095C

Split-Comp.

5D000A
005C25
00375C

Tetradic

5D000A
375C00
005C53
25005C

Contrast Matrix WCAG 2.1 Contrast

5D000A
DCDCDA
C1C2C4
00555E
B0B4B3
—
10.4
AAA
8.0
AAA
1.7
Fail
6.8
AA
10.4
AAA
—
1.3
Fail
6.2
AA
1.5
Fail
8.0
AAA
1.3
Fail
—
4.8
AA
1.2
Fail
1.7
Fail
6.2
AA
4.8
AA
—
4.1
AA Large
6.8
AA
1.5
Fail
1.2
Fail
4.1
AA Large
—
White BG
14.3AAA
1.4Fail
1.8Fail
8.5AAA
2.1Fail
Black BG
1.5Fail
15.3AAA
11.8AAA
2.5Fail
10.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

353408
DCDCDA
C1C1C4
25265C
B2B2B3

Deuteranopia

3A4107
DCDCDB
C1C1C3
201A5B
B2B1B3

Tritanopia

580605
DCDBDB
C1C3C3
045A5A
B0B3B3

Achromatopsia

1D1D1D
DCDCDC
C2C2C2
3D3D3D
B3B3B3

Shades & Tints Shades & Tints

#5D000A

Dark
Light

#DCDCDA

Dark
Light

#C1C2C4

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5d000a;
  --color-2: #dcdcda;
  --color-3: #c1c2c4;
  --color-4: #00555e;
  --color-5: #b0b4b3;
}

SCSS

$color-1: #5d000a;
$color-2: #dcdcda;
$color-3: #c1c2c4;
$color-4: #00555e;
$color-5: #b0b4b3;

TAILWIND

colors: {
  'brand-1': '#5d000a',
  'brand-2': '#dcdcda',
  'brand-3': '#c1c2c4',
  'brand-4': '#00555e',
  'brand-5': '#b0b4b3',
}

RGB Array

[93, 0, 10], [220, 220, 218], [193, 194, 196], [0, 85, 94], [176, 180, 179]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #5D000A, #DCDCDA, #C1C2C4, #00555E, #B0B4B3 is ideal for: 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: #5d000a; --color-2: #dcdcda; --color-3: #c1c2c4; --color-4: #00555e; --color-5: #b0b4b3. 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. 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