#31291D#31291D
#31291D is a dark, muted orange. Relative luminance 0.023; OKLCH L 28.6% C 0.024 H 77.6°. Best body text is #FFFFFF at 14.33:1 contrast (WCAG AA passes).
Color values
| HEX | #31291D |
|---|---|
| RGB | rgb(49, 41, 29) |
| HSL | hsl(36, 26%, 15%) |
| HSV | hsv(36, 41%, 19%) |
| CMYK | cmyk(0%, 16.3%, 40.8%, 80.8%) |
| CIE-LAB | lab(17.12, 1.47, 9.25) |
| CIE-LCH | lch(17.12, 9.37, 80.97°) |
| OKLab | oklab(28.61% 0.0051 0.0233) |
| OKLCH | oklch(28.61% 0.024 77.6) |
| XYZ | xyz(2.2814, 2.3276, 1.4913) |
| Luminance | 0.0233 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Espresso
#4B382A
ΔE00 8.10
Dark Grey
#363737
ΔE00 9.13
Dark Brown
#341C02
ΔE00 9.57
Charcoal (survey)
#343837
ΔE00 9.91
Onyx
#353839
ΔE00 10.25
Charcoal Grey
#3C4142
ΔE00 12.23
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#31291D #1D2531
analogous
#311F1D #31291D #2F311D
triadic
#31291D #1D3129 #291D31
tetradic
#31291D #1D311F #1D2531 #311D2F
square
#31291D #1D311F #1D2531 #311D2F
split-complementary
#31291D #1D2F31 #1F1D31
monochromatic
#13100B #13100B #31291D #574934 #7E694B
Accessibility & contrast
On white
14.33
#31291D on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
1.47
#31291D on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #31291D
14.33:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##31291D | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##31291D | 1.00 | 14.33 | 1.47 | 14.33 |
| #FFFFFF | 14.33 | 1.00 | 21.00 | 1.00 |
| #000000 | 1.47 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 14.33 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#2C291C
Deuteranopia (green-blind)
#2E2B1D
Tritanopia (blue-blind)
#342726
Achromatopsia (no color)
#2A2A2A
Design tokens & code
CSS
--color: #31291d; /* rgb */ color: rgb(49, 41, 29); /* oklch */ color: oklch(28.6% 0.024 77.6);
Tailwind
colors: {
custom: {
50: '#696259',
500: '#31291d',
950: '#000000',
},
}SCSS
$custom: #31291d; $custom-light: #696259; $custom-dark: #000000;
JSON
{
"hex": "#31291d",
"rgb": {
"r": 49,
"g": 41,
"b": 29
},
"hsl": {
"h": 36,
"s": 25.641,
"l": 15.294
},
"oklch": {
"l": 0.28609,
"c": 0.0238,
"h": 77.6
},
"luminance": 0.02328
}Semantic roles & 50–950 ramp
primary
#31291D
secondary
#465264
accent
#8BC266
background
#F6F5F5
surface
#EBEAE9
border
#C6C6C5
text
#060503
muted
#7A7978