#62201F#62201F
#62201F is a dark, moderate red. Relative luminance 0.037; OKLCH L 34.6% C 0.096 H 24.4°. Best body text is #FFFFFF at 12.03:1 contrast (WCAG AA passes).
Color values
| HEX | #62201F |
|---|---|
| RGB | rgb(98, 32, 31) |
| HSL | hsl(1, 52%, 25%) |
| HSV | hsv(1, 68%, 38%) |
| CMYK | cmyk(0%, 67.3%, 68.4%, 61.6%) |
| CIE-LAB | lab(22.76, 29.81, 16.73) |
| CIE-LCH | lch(22.76, 34.19, 29.30°) |
| OKLab | oklab(34.56% 0.0876 0.0398) |
| OKLCH | oklch(34.56% 0.096 24.4) |
| XYZ | xyz(5.8014, 3.7294, 1.7104) |
| Luminance | 0.0373 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Claret
#680018
ΔE00 5.30
Rosewood
#65000B
ΔE00 5.51
Wine
#722F37
ΔE00 6.61
Dried Blood
#4B0101
ΔE00 6.97
Wine Red
#7B0323
ΔE00 7.04
Mahogany
#4A0100
ΔE00 7.13
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#62201F #1F6162
analogous
#621F3F #62201F #62421F
triadic
#62201F #1F6220 #201F62
tetradic
#62201F #3F621F #1F6162 #421F62
square
#62201F #3F621F #1F6162 #421F62
split-complementary
#62201F #1F6242 #1F3F62
monochromatic
#170807 #341110 #62201F #902F2E #BF3E3C
Accessibility & contrast
On white
12.03
#62201F on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
1.75
#62201F on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #62201F
12.03:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##62201F | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##62201F | 1.00 | 12.03 | 1.75 | 12.03 |
| #FFFFFF | 12.03 | 1.00 | 21.00 | 1.00 |
| #000000 | 1.75 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 12.03 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#312D1E
Deuteranopia (green-blind)
#423C1D
Tritanopia (blue-blind)
#6C1220
Achromatopsia (no color)
#363636
Design tokens & code
CSS
--color: #62201f; /* rgb */ color: rgb(98, 32, 31); /* oklch */ color: oklch(34.6% 0.096 24.4);
Tailwind
colors: {
custom: {
50: '#945f5a',
500: '#62201f',
950: '#000000',
},
}SCSS
$custom: #62201f; $custom-light: #945f5a; $custom-dark: #000000;
JSON
{
"hex": "#62201f",
"rgb": {
"r": 98,
"g": 32,
"b": 31
},
"hsl": {
"h": 0.896,
"s": 51.938,
"l": 25.294
},
"oklch": {
"l": 0.34556,
"c": 0.09619,
"h": 24.4
},
"luminance": 0.03729
}Semantic roles & 50–950 ramp
primary
#62201F
secondary
#469597
accent
#D9DB4C
background
#F9F5F5
surface
#F2E9E9
border
#CCC5C5
text
#0E0503
muted
#7E7978