#B43216#B43216
#B43216 is a mid, vivid red. Relative luminance 0.120; OKLCH L 51.3% C 0.171 H 33.5°. Best body text is #FFFFFF at 6.16:1 contrast (WCAG AA passes).
Color values
| HEX | #B43216 |
|---|---|
| RGB | rgb(180, 50, 22) |
| HSL | hsl(11, 78%, 40%) |
| HSV | hsv(11, 88%, 71%) |
| CMYK | cmyk(0%, 72.2%, 87.8%, 29.4%) |
| CIE-LAB | lab(41.29, 51.01, 45.78) |
| CIE-LCH | lch(41.29, 68.54, 41.91°) |
| OKLab | oklab(51.33% 0.1427 0.0943) |
| OKLCH | oklch(51.33% 0.171 33.5) |
| XYZ | xyz(20.1103, 12.0456, 2.0250) |
| Luminance | 0.1204 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Rusty Red
#AF2F0D
ΔE00 1.73
Rust Red
#AA2704
ΔE00 3.33
Brick
#A03623
ΔE00 4.68
Brownish Red
#9E3623
ΔE00 5.02
Rust
#B7410E
ΔE00 5.09
Rust (survey)
#A83C09
ΔE00 5.10
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#B43216 #1698B4
analogous
#B41649 #B43216 #B48116
triadic
#B43216 #16B432 #3216B4
tetradic
#B43216 #49B416 #1698B4 #8116B4
square
#B43216 #49B416 #1698B4 #8116B4
split-complementary
#B43216 #16B481 #1649B4
monochromatic
#471409 #7D230F #B43216 #E44523 #EB735A
Accessibility & contrast
On white
6.16
#B43216 on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.41
#B43216 on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #B43216
6.16:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##B43216 | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##B43216 | 1.00 | 6.16 | 3.41 | 6.16 |
| #FFFFFF | 6.16 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.41 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 6.16 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#5A4F10
Deuteranopia (green-blind)
#7A6C0C
Tritanopia (blue-blind)
#C7002D
Achromatopsia (no color)
#616161
Design tokens & code
CSS
--color: #b43216; /* rgb */ color: rgb(180, 50, 22); /* oklch */ color: oklch(51.3% 0.171 33.5);
Tailwind
colors: {
custom: {
50: '#d47357',
500: '#b43216',
950: '#000000',
},
}SCSS
$custom: #b43216; $custom-light: #d47357; $custom-dark: #000000;
JSON
{
"hex": "#b43216",
"rgb": {
"r": 180,
"g": 50,
"b": 22
},
"hsl": {
"h": 10.633,
"s": 78.218,
"l": 39.608
},
"oklch": {
"l": 0.51335,
"c": 0.17107,
"h": 33.5
},
"luminance": 0.12042
}Semantic roles & 50–950 ramp
primary
#B43216
secondary
#58B9CE
accent
#D2F533
background
#FEF7F5
surface
#FDEDE9
border
#D5C8C5
text
#160903
muted
#847B78