#372B2B#372B2B
#372B2B is a dark, near-neutral red. Relative luminance 0.027; OKLCH L 30.3% C 0.018 H 18.2°. Best body text is #FFFFFF at 13.61:1 contrast (WCAG AA passes).
Color values
| HEX | #372B2B |
|---|---|
| RGB | rgb(55, 43, 43) |
| HSL | hsl(0, 12%, 19%) |
| HSV | hsv(0, 22%, 22%) |
| CMYK | cmyk(0%, 21.8%, 21.8%, 78.4%) |
| CIE-LAB | lab(18.86, 5.53, 2.09) |
| CIE-LCH | lch(18.86, 5.91, 20.73°) |
| OKLab | oklab(30.26% 0.0169 0.0056) |
| OKLCH | oklch(30.26% 0.018 18.2) |
| XYZ | xyz(2.8755, 2.7145, 2.6575) |
| Luminance | 0.0271 (WCAG relative) |
| Temperature | warm |
| Family | red |
Closest named colors
Dark Grey
#363737
ΔE00 8.45
Espresso
#4B382A
ΔE00 9.04
Onyx
#353839
ΔE00 9.88
Charcoal (survey)
#343837
ΔE00 10.79
Very Dark Brown
#1D0200
ΔE00 11.07
Charcoal Grey
#3C4142
ΔE00 12.27
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#372B2B #2B3737
analogous
#372B31 #372B2B #37312B
triadic
#372B2B #2B372B #2B2B37
tetradic
#372B2B #31372B #2B3737 #312B37
square
#372B2B #31372B #2B3737 #312B37
split-complementary
#372B2B #2B3731 #2B3137
monochromatic
#110D0D #151010 #372B2B #594646 #7C6161
Accessibility & contrast
On white
13.61
#372B2B on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
1.54
#372B2B on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #372B2B
13.61:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##372B2B | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##372B2B | 1.00 | 13.61 | 1.54 | 13.61 |
| #FFFFFF | 13.61 | 1.00 | 21.00 | 1.00 |
| #000000 | 1.54 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 13.61 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#2D2D2B
Deuteranopia (green-blind)
#302F2B
Tritanopia (blue-blind)
#3A2A2B
Achromatopsia (no color)
#2E2E2E
Design tokens & code
CSS
--color: #372b2b; /* rgb */ color: rgb(55, 43, 43); /* oklch */ color: oklch(30.3% 0.018 18.2);
Tailwind
colors: {
custom: {
50: '#6e6464',
500: '#372b2b',
950: '#000000',
},
}SCSS
$custom: #372b2b; $custom-light: #6e6464; $custom-dark: #000000;
JSON
{
"hex": "#372b2b",
"rgb": {
"r": 55,
"g": 43,
"b": 43
},
"hsl": {
"h": 0,
"s": 12.245,
"l": 19.216
},
"oklch": {
"l": 0.30264,
"c": 0.01781,
"h": 18.2
},
"luminance": 0.02714
}Semantic roles & 50–950 ramp
primary
#372B2B
secondary
#576767
accent
#B5B573
background
#F6F5F5
surface
#EBEAEA
border
#C6C6C6
text
#070505
muted
#7A7979