#5B1322#5B1322
#5B1322 is a dark, moderate red. Relative luminance 0.028; OKLCH L 31.7% C 0.103 H 13.6°. Best body text is #FFFFFF at 13.45:1 contrast (WCAG AA passes).
Color values
| HEX | #5B1322 |
|---|---|
| RGB | rgb(91, 19, 34) |
| HSL | hsl(348, 65%, 22%) |
| HSV | hsv(348, 79%, 36%) |
| CMYK | cmyk(0%, 79.1%, 62.6%, 64.3%) |
| CIE-LAB | lab(19.25, 33.34, 9.83) |
| CIE-LCH | lch(19.25, 34.76, 16.42°) |
| OKLab | oklab(31.7% 0.1004 0.0243) |
| OKLCH | oklch(31.7% 0.103 13.6) |
| XYZ | xyz(4.8365, 2.8061, 1.8000) |
| Luminance | 0.0280 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Maroon (survey)
#650021
ΔE00 3.17
Burgundy (survey)
#610023
ΔE00 3.25
Claret
#680018
ΔE00 5.17
Bordeaux
#7B002C
ΔE00 6.64
Wine Red
#7B0323
ΔE00 7.00
Dark Maroon
#3C0008
ΔE00 7.14
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#5B1322 #135B4C
analogous
#5B1346 #5B1322 #5B2813
triadic
#5B1322 #225B13 #13225B
tetradic
#5B1322 #465B13 #135B4C #28135B
square
#5B1322 #465B13 #135B4C #28135B
split-complementary
#5B1322 #135B28 #13465B
monochromatic
#190509 #28080F #5B1322 #8E1E35 #C02848
Accessibility & contrast
On white
13.45
#5B1322 on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
1.56
#5B1322 on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #5B1322
13.45:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##5B1322 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##5B1322 | 1.00 | 13.45 | 1.56 | 13.45 |
| #FFFFFF | 13.45 | 1.00 | 21.00 | 1.00 |
| #000000 | 1.56 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 13.45 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#262522
Deuteranopia (green-blind)
#393420
Tritanopia (blue-blind)
#640119
Achromatopsia (no color)
#2F2F2F
Design tokens & code
CSS
--color: #5b1322; /* rgb */ color: rgb(91, 19, 34); /* oklch */ color: oklch(31.7% 0.103 13.6);
Tailwind
colors: {
custom: {
50: '#8e585c',
500: '#5b1322',
950: '#000000',
},
}SCSS
$custom: #5b1322; $custom-light: #8e585c; $custom-dark: #000000;
JSON
{
"hex": "#5b1322",
"rgb": {
"r": 91,
"g": 19,
"b": 34
},
"hsl": {
"h": 347.5,
"s": 65.455,
"l": 21.569
},
"oklch": {
"l": 0.31696,
"c": 0.10331,
"h": 13.6
},
"luminance": 0.02805
}Semantic roles & 50–950 ramp
primary
#5B1322
secondary
#379380
accent
#E8C53F
background
#F9F5F5
surface
#F1E9E9
border
#CBC5C5
text
#0D0304
muted
#7E7879