← Back to Editor

#101210 · #171A16 · #252923 · #CFE6C3 · #BA2543

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarm

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporateData Visualization

Color Details Color Details

#101210

Ink Black · Black · Jet Black

HEX
#101210
RGB
rgb(16, 18, 16)
HSL
hsl(120, 6%, 7%)
HSB
hsb(120, 11%, 7%)
CMYK
cmyk(11%, 0%, 11%, 93%)
Oklch
oklch(17.9% 0.005 145.4)

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

#171A16

Celadon · Black · Jet Black

HEX
#171A16
RGB
rgb(23, 26, 22)
HSL
hsl(105, 8%, 9%)
HSB
hsb(105, 15%, 10%)
CMYK
cmyk(12%, 0%, 15%, 90%)
Oklch
oklch(21.3% 0.009 137.8)

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

#252923

Celadon · DarkSlateGray · Dark Stone

HEX
#252923
RGB
rgb(37, 41, 35)
HSL
hsl(100, 8%, 15%)
HSB
hsb(100, 15%, 16%)
CMYK
cmyk(10%, 0%, 15%, 84%)
Oklch
oklch(27.5% 0.012 135.1)

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

#CFE6C3

Celadon · LightGray · Mint Green

HEX
#CFE6C3
RGB
rgb(207, 230, 195)
HSL
hsl(99, 41%, 83%)
HSB
hsb(99, 15%, 90%)
CMYK
cmyk(10%, 0%, 15%, 10%)
Oklch
oklch(89.9% 0.053 134.8)

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

#BA2543

Vermilion · Brown · Passion Red

HEX
#BA2543
RGB
rgb(186, 37, 67)
HSL
hsl(348, 67%, 44%)
HSB
hsb(348, 80%, 73%)
CMYK
cmyk(0%, 80%, 64%, 27%)
Oklch
oklch(51.9% 0.183 16.0)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

101210
131113

Analogous

121311
101210
111312

Triadic

101210
111113
131111

Split-Comp.

101210
121113
131112

Tetradic

101210
111213
131113
131211

Contrast Matrix WCAG 2.1 Contrast

101210
171A16
252923
CFE6C3
BA2543
—
1.1
Fail
1.3
Fail
14.1
AAA
3.1
AA Large
1.1
Fail
—
1.2
Fail
13.2
AAA
2.9
Fail
1.3
Fail
1.2
Fail
—
11.1
AAA
2.4
Fail
14.1
AAA
13.2
AAA
11.1
AAA
—
4.6
AA
3.1
AA Large
2.9
Fail
2.4
Fail
4.6
AA
—
White BG
18.8AAA
17.6AAA
14.8AAA
1.3Fail
6.1AA
Black BG
1.1Fail
1.2Fail
1.4Fail
15.8AAA
3.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

111110
181817
272724
D9D9CB
79783C

Deuteranopia

111111
181817
272625
D8D6CE
828D3A

Tritanopia

101111
171818
252626
D0D2D4
B33635

Achromatopsia

111111
191919
272727
DBDBDB
555555

Shades & Tints Shades & Tints

#101210

Dark
Light

#171A16

Dark
Light

#252923

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #101210;
  --color-2: #171a16;
  --color-3: #252923;
  --color-4: #cfe6c3;
  --color-5: #ba2543;
}

SCSS

$color-1: #101210;
$color-2: #171a16;
$color-3: #252923;
$color-4: #cfe6c3;
$color-5: #ba2543;

TAILWIND

colors: {
  'brand-1': '#101210',
  'brand-2': '#171a16',
  'brand-3': '#252923',
  'brand-4': '#cfe6c3',
  'brand-5': '#ba2543',
}

RGB Array

[16, 18, 16], [23, 26, 22], [37, 41, 35], [207, 230, 195], [186, 37, 67]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #101210, #171A16, #252923, #CFE6C3, #BA2543 is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs, 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: #101210; --color-2: #171a16; --color-3: #252923; --color-4: #cfe6c3; --color-5: #ba2543. 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 general-style 5-color scheme is especially suited for finance, legal, luxury 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