#712B16#712B16
#712B16 is a dark, moderate red. Relative luminance 0.053; OKLCH L 38.7% C 0.105 H 37.1°. Best body text is #FFFFFF at 10.20:1 contrast (WCAG AA passes).
Color values
| HEX | #712B16 |
|---|---|
| RGB | rgb(113, 43, 22) |
| HSL | hsl(14, 67%, 26%) |
| HSV | hsv(14, 81%, 44%) |
| CMYK | cmyk(0%, 61.9%, 80.5%, 55.7%) |
| CIE-LAB | lab(27.57, 29.68, 28.60) |
| CIE-LCH | lch(27.57, 41.22, 43.94°) |
| OKLab | oklab(38.68% 0.0834 0.063) |
| OKLCH | oklch(38.68% 0.105 37.1) |
| XYZ | xyz(7.8196, 5.2975, 1.3697) |
| Luminance | 0.0530 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Reddish Brown
#7F2B0A
ΔE00 4.22
Chestnut
#742802
ΔE00 4.29
Reddy Brown
#6E1005
ΔE00 5.45
Red Brown
#8B2E16
ΔE00 5.51
Indian Red
#850E04
ΔE00 6.47
Blood
#770001
ΔE00 6.92
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#712B16 #165C71
analogous
#71162F #712B16 #715916
triadic
#712B16 #16712B #2B1671
tetradic
#712B16 #2F7116 #165C71 #591671
square
#712B16 #2F7116 #165C71 #591671
split-complementary
#712B16 #167159 #162F71
monochromatic
#1A0A05 #3E180C #712B16 #A43E20 #D6532C
Accessibility & contrast
On white
10.20
#712B16 on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.06
#712B16 on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #712B16
10.20:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##712B16 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##712B16 | 1.00 | 10.20 | 2.06 | 10.20 |
| #FFFFFF | 10.20 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.06 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 10.20 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#3E3713
Deuteranopia (green-blind)
#504714
Tritanopia (blue-blind)
#7D1B27
Achromatopsia (no color)
#414141
Design tokens & code
CSS
--color: #712b16; /* rgb */ color: rgb(113, 43, 22); /* oklch */ color: oklch(38.7% 0.105 37.1);
Tailwind
colors: {
custom: {
50: '#a06754',
500: '#712b16',
950: '#000000',
},
}SCSS
$custom: #712b16; $custom-light: #a06754; $custom-dark: #000000;
JSON
{
"hex": "#712b16",
"rgb": {
"r": 113,
"g": 43,
"b": 22
},
"hsl": {
"h": 13.846,
"s": 67.407,
"l": 26.471
},
"oklch": {
"l": 0.38679,
"c": 0.10456,
"h": 37.1
},
"luminance": 0.05296
}Semantic roles & 50–950 ramp
primary
#712B16
secondary
#3C8EA7
accent
#C2EA3E
background
#FAF6F4
surface
#F4EBE7
border
#CEC6C3
text
#100603
muted
#7F7A78