#561F28#561F28
#561F28 is a dark, moderate red. Relative luminance 0.031; OKLCH L 32.5% C 0.082 H 12.9°. Best body text is #FFFFFF at 12.94:1 contrast (WCAG AA passes).
Color values
| HEX | #561F28 |
|---|---|
| RGB | rgb(86, 31, 40) |
| HSL | hsl(350, 47%, 23%) |
| HSV | hsv(350, 64%, 34%) |
| CMYK | cmyk(0%, 64%, 53.5%, 66.3%) |
| CIE-LAB | lab(20.49, 26.39, 7.15) |
| CIE-LCH | lch(20.49, 27.34, 15.16°) |
| OKLab | oklab(32.48% 0.0798 0.0182) |
| OKLCH | oklch(32.48% 0.082 12.9) |
| XYZ | xyz(4.7111, 3.1122, 2.3597) |
| Luminance | 0.0311 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Burgundy (survey)
#610023
ΔE00 5.98
Maroon (survey)
#650021
ΔE00 6.25
Wine
#722F37
ΔE00 6.66
Purple Brown
#673A3F
ΔE00 7.68
Claret
#680018
ΔE00 7.87
Dark Maroon
#3C0008
ΔE00 7.99
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#561F28 #1F564D
analogous
#561F43 #561F28 #56311F
triadic
#561F28 #28561F #1F2856
tetradic
#561F28 #43561F #1F564D #311F56
square
#561F28 #43561F #1F564D #311F56
split-complementary
#561F28 #1F5631 #1F4356
monochromatic
#16080A #290F13 #561F28 #832F3D #B03F52
Accessibility & contrast
On white
12.94
#561F28 on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
1.62
#561F28 on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #561F28
12.94:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##561F28 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##561F28 | 1.00 | 12.94 | 1.62 | 12.94 |
| #FFFFFF | 12.94 | 1.00 | 21.00 | 1.00 |
| #000000 | 1.62 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 12.94 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#2B2A28
Deuteranopia (green-blind)
#393627
Tritanopia (blue-blind)
#5E1722
Achromatopsia (no color)
#313131
Design tokens & code
CSS
--color: #561f28; /* rgb */ color: rgb(86, 31, 40); /* oklch */ color: oklch(32.5% 0.082 12.9);
Tailwind
colors: {
custom: {
50: '#895d61',
500: '#561f28',
950: '#000000',
},
}SCSS
$custom: #561f28; $custom-light: #895d61; $custom-dark: #000000;
JSON
{
"hex": "#561f28",
"rgb": {
"r": 86,
"g": 31,
"b": 40
},
"hsl": {
"h": 350.182,
"s": 47.009,
"l": 22.941
},
"oklch": {
"l": 0.32482,
"c": 0.08184,
"h": 12.9
},
"luminance": 0.03112
}Semantic roles & 50–950 ramp
primary
#561F28
secondary
#468B80
accent
#D7C151
background
#F8F5F5
surface
#F0E9E9
border
#CBC5C5
text
#0C0405
muted
#7D7979