#14476F#14476F
#14476F is a dark, moderate cyan. Relative luminance 0.058; OKLCH L 38.6% C 0.086 H 246.6°. Best body text is #FFFFFF at 9.72:1 contrast (WCAG AA passes).
Color values
| HEX | #14476F |
|---|---|
| RGB | rgb(20, 71, 111) |
| HSL | hsl(206, 69%, 26%) |
| HSV | hsv(206, 82%, 44%) |
| CMYK | cmyk(82%, 36%, 0%, 56.5%) |
| CIE-LAB | lab(28.91, -1.24, -27.83) |
| CIE-LCH | lch(28.91, 27.85, 267.46°) |
| OKLab | oklab(38.59% -0.0342 -0.0791) |
| OKLCH | oklch(38.59% 0.086 246.6) |
| XYZ | xyz(5.4099, 5.8022, 15.8707) |
| Luminance | 0.0580 (WCAG relative) |
| Temperature | cool |
| Family | cyan |
Closest named colors
Prussian Blue
#004577
ΔE00 1.72
Twilight Blue
#0A437A
ΔE00 2.91
Light Navy
#155084
ΔE00 3.69
Dark Slate Blue
#214761
ΔE00 3.94
Darkish Blue
#014182
ΔE00 4.09
Deep Sea Blue
#015482
ΔE00 4.90
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#14476F #6F3C14
analogous
#146F69 #14476F #14196F
triadic
#14476F #6F1447 #476F14
tetradic
#14476F #69146F #6F3C14 #196F14
square
#14476F #69146F #6F3C14 #196F14
split-complementary
#14476F #6F1419 #6F6914
monochromatic
#05111A #0B263B #14476F #1D68A3 #2789D7
Accessibility & contrast
On white
9.72
#14476F on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.16
#14476F on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #14476F
9.72:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##14476F | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##14476F | 1.00 | 9.72 | 2.16 | 9.72 |
| #FFFFFF | 9.72 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.16 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 9.72 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#344971
Deuteranopia (green-blind)
#27406E
Tritanopia (blue-blind)
#005155
Achromatopsia (no color)
#444444
Design tokens & code
CSS
--color: #14476f; /* rgb */ color: rgb(20, 71, 111); /* oklch */ color: oklch(38.6% 0.086 246.6);
Tailwind
colors: {
custom: {
50: '#617998',
500: '#14476f',
950: '#000000',
},
}SCSS
$custom: #14476f; $custom-light: #617998; $custom-dark: #000000;
JSON
{
"hex": "#14476f",
"rgb": {
"r": 20,
"g": 71,
"b": 111
},
"hsl": {
"h": 206.374,
"s": 69.466,
"l": 25.686
},
"oklch": {
"l": 0.38594,
"c": 0.0862,
"h": 246.6
},
"luminance": 0.05803
}Semantic roles & 50–950 ramp
primary
#14476F
secondary
#A66939
accent
#893CEC
background
#F6F7F9
surface
#EBEDF2
border
#C6C8CC
text
#06090D
muted
#7A7B7E