#712C22#712C22
#712C22 is a dark, moderate red. Relative luminance 0.054; OKLCH L 39.0% C 0.100 H 30.5°. Best body text is #FFFFFF at 10.07:1 contrast (WCAG AA passes).
Color values
| HEX | #712C22 |
|---|---|
| RGB | rgb(113, 44, 34) |
| HSL | hsl(8, 54%, 29%) |
| HSV | hsv(8, 70%, 44%) |
| CMYK | cmyk(0%, 61.1%, 69.9%, 55.7%) |
| CIE-LAB | lab(27.92, 29.80, 21.76) |
| CIE-LCH | lch(27.92, 36.90, 36.13°) |
| OKLab | oklab(39% 0.0863 0.0508) |
| OKLCH | oklch(39% 0.1 30.5) |
| XYZ | xyz(8.0002, 5.4286, 2.1396) |
| Luminance | 0.0543 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Reddy Brown
#6E1005
ΔE00 6.19
Red Brown
#8B2E16
ΔE00 7.29
Blood
#770001
ΔE00 7.39
Rosewood
#65000B
ΔE00 7.69
Indian Red
#850E04
ΔE00 7.71
Reddish Brown
#7F2B0A
ΔE00 7.71
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#712C22 #226771
analogous
#712240 #712C22 #715422
triadic
#712C22 #22712C #2C2271
tetradic
#712C22 #407122 #226771 #542271
square
#712C22 #407122 #226771 #542271
split-complementary
#712C22 #227154 #224071
monochromatic
#180907 #421A14 #712C22 #A03E30 #C75646
Accessibility & contrast
On white
10.07
#712C22 on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.09
#712C22 on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #712C22
10.07:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##712C22 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##712C22 | 1.00 | 10.07 | 2.09 | 10.07 |
| #FFFFFF | 10.07 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.09 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 10.07 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#3E3921
Deuteranopia (green-blind)
#4F4820
Tritanopia (blue-blind)
#7C1E2A
Achromatopsia (no color)
#424242
Design tokens & code
CSS
--color: #712c22; /* rgb */ color: rgb(113, 44, 34); /* oklch */ color: oklch(39.0% 0.100 30.5);
Tailwind
colors: {
custom: {
50: '#9f685d',
500: '#712c22',
950: '#000000',
},
}SCSS
$custom: #712c22; $custom-light: #9f685d; $custom-dark: #000000;
JSON
{
"hex": "#712c22",
"rgb": {
"r": 113,
"g": 44,
"b": 34
},
"hsl": {
"h": 7.595,
"s": 53.741,
"l": 28.824
},
"oklch": {
"l": 0.38999,
"c": 0.10014,
"h": 30.5
},
"luminance": 0.05428
}Semantic roles & 50–950 ramp
primary
#712C22
secondary
#4A99A4
accent
#CBDD4B
background
#FAF6F5
surface
#F4EBE9
border
#CEC6C5
text
#0F0604
muted
#7F7A79