#12214B#12214B
#12214B is a dark, moderate blue. Relative luminance 0.017; OKLCH L 26.2% C 0.081 H 266.2°. Best body text is #FFFFFF at 15.62:1 contrast (WCAG AA passes).
Color values
| HEX | #12214B |
|---|---|
| RGB | rgb(18, 33, 75) |
| HSL | hsl(224, 61%, 18%) |
| HSV | hsv(224, 76%, 29%) |
| CMYK | cmyk(76%, 56%, 0%, 70.6%) |
| CIE-LAB | lab(13.97, 10.30, -27.99) |
| CIE-LCH | lch(13.97, 29.83, 290.21°) |
| OKLab | oklab(26.2% -0.0054 -0.0803) |
| OKLCH | oklch(26.2% 0.081 266.2) |
| XYZ | xyz(2.0629, 1.7241, 6.8793) |
| Luminance | 0.0172 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Closest named colors
Navy (survey)
#01153E
ΔE00 3.77
Navy Blue
#1B2A4A
ΔE00 3.90
Navy Blue (survey)
#001146
ΔE00 5.37
Marine
#042E60
ΔE00 5.89
Dark Navy
#000435
ΔE00 7.15
Dark Navy Blue
#00022E
ΔE00 7.53
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#12214B #4B3C12
analogous
#123D4B #12214B #20124B
triadic
#12214B #4B1221 #214B12
tetradic
#12214B #4B123D #4B3C12 #124B20
square
#12214B #4B123D #4B3C12 #124B20
split-complementary
#12214B #4B2012 #3D4B12
monochromatic
#060B19 #060B1A #12214B #1E377C #2A4CAE
Accessibility & contrast
On white
15.62
#12214B on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
1.34
#12214B on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #12214B
15.62:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##12214B | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##12214B | 1.00 | 15.62 | 1.34 | 15.62 |
| #FFFFFF | 15.62 | 1.00 | 21.00 | 1.00 |
| #000000 | 1.34 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 15.62 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#08264D
Deuteranopia (green-blind)
#00214A
Tritanopia (blue-blind)
#002B32
Achromatopsia (no color)
#242424
Design tokens & code
CSS
--color: #12214b; /* rgb */ color: rgb(18, 33, 75); /* oklch */ color: oklch(26.2% 0.081 266.2);
Tailwind
colors: {
custom: {
50: '#585b7e',
500: '#12214b',
950: '#000000',
},
}SCSS
$custom: #12214b; $custom-light: #585b7e; $custom-dark: #000000;
JSON
{
"hex": "#12214b",
"rgb": {
"r": 18,
"g": 33,
"b": 75
},
"hsl": {
"h": 224.211,
"s": 61.29,
"l": 18.235
},
"oklch": {
"l": 0.26203,
"c": 0.08053,
"h": 266.2
},
"luminance": 0.01724
}Semantic roles & 50–950 ramp
primary
#12214B
secondary
#846F35
accent
#BA43E4
background
#F5F5F7
surface
#E9E9EE
border
#C5C5C9
text
#04040A
muted
#79797C