#53382C#53382C
#53382C is a dark, muted orange. Relative luminance 0.048; OKLCH L 36.9% C 0.044 H 44.9°. Best body text is #FFFFFF at 10.66:1 contrast (WCAG AA passes).
Color values
| HEX | #53382C |
|---|---|
| RGB | rgb(83, 56, 44) |
| HSL | hsl(18, 31%, 25%) |
| HSV | hsv(18, 47%, 33%) |
| CMYK | cmyk(0%, 32.5%, 47%, 67.5%) |
| CIE-LAB | lab(26.30, 10.31, 12.31) |
| CIE-LCH | lch(26.30, 16.06, 50.06°) |
| OKLab | oklab(36.85% 0.0309 0.0308) |
| OKLCH | oklch(36.85% 0.044 44.9) |
| XYZ | xyz(5.4363, 4.8496, 3.0321) |
| Luminance | 0.0485 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Espresso
#4B382A
ΔE00 4.24
Walnut
#5C4A3D
ΔE00 7.03
Umber
#635147
ΔE00 8.83
Chocolate (survey)
#3D1C02
ΔE00 9.65
Dark Brown
#341C02
ΔE00 10.34
Chocolate Brown
#411900
ΔE00 10.35
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#53382C #2C4753
analogous
#532C33 #53382C #534C2C
triadic
#53382C #2C5338 #382C53
tetradic
#53382C #33532C #2C4753 #4C2C53
square
#53382C #33532C #2C4753 #4C2C53
split-complementary
#53382C #2C534C #2C3353
monochromatic
#140D0B #2B1D17 #53382C #7B5341 #A36E56
Accessibility & contrast
On white
10.66
#53382C on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
1.97
#53382C on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #53382C
10.66:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##53382C | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##53382C | 1.00 | 10.66 | 1.97 | 10.66 |
| #FFFFFF | 10.66 | 1.00 | 21.00 | 1.00 |
| #000000 | 1.97 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 10.66 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#3F3B2B
Deuteranopia (green-blind)
#45402C
Tritanopia (blue-blind)
#593435
Achromatopsia (no color)
#3E3E3E
Design tokens & code
CSS
--color: #53382c; /* rgb */ color: rgb(83, 56, 44); /* oklch */ color: oklch(36.9% 0.044 44.9);
Tailwind
colors: {
custom: {
50: '#856e65',
500: '#53382c',
950: '#000000',
},
}SCSS
$custom: #53382c; $custom-light: #856e65; $custom-dark: #000000;
JSON
{
"hex": "#53382c",
"rgb": {
"r": 83,
"g": 56,
"b": 44
},
"hsl": {
"h": 18.462,
"s": 30.709,
"l": 24.902
},
"oklch": {
"l": 0.36854,
"c": 0.04365,
"h": 44.9
},
"luminance": 0.04849
}Semantic roles & 50–950 ramp
primary
#53382C
secondary
#567685
accent
#A8C761
background
#F8F6F6
surface
#EFECEB
border
#CAC7C6
text
#0B0705
muted
#7C7A7A