#50463E#50463E
#50463E is a dark, near-neutral orange. Relative luminance 0.064; OKLCH L 40.2% C 0.019 H 60.9°. Best body text is #FFFFFF at 9.18:1 contrast (WCAG AA passes).
Color values
| HEX | #50463E |
|---|---|
| RGB | rgb(80, 70, 62) |
| HSL | hsl(27, 13%, 28%) |
| HSV | hsv(27, 23%, 31%) |
| CMYK | cmyk(0%, 12.5%, 22.5%, 68.6%) |
| CIE-LAB | lab(30.48, 2.72, 6.38) |
| CIE-LCH | lch(30.48, 6.93, 66.87°) |
| OKLab | oklab(40.17% 0.0092 0.0165) |
| OKLCH | oklch(40.17% 0.019 60.9) |
| XYZ | xyz(6.3679, 6.4338, 5.4629) |
| Luminance | 0.0643 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Walnut
#5C4A3D
ΔE00 4.47
Umber
#635147
ΔE00 5.78
Espresso
#4B382A
ΔE00 6.46
Dark Grey
#363737
ΔE00 8.95
Charcoal Grey
#3C4142
ΔE00 9.50
Onyx
#353839
ΔE00 9.83
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#50463E #3E4850
analogous
#503E3F #50463E #504F3E
triadic
#50463E #3E5046 #463E50
tetradic
#50463E #3F503E #3E4850 #4F3E50
square
#50463E #3F503E #3E4850 #4F3E50
split-complementary
#50463E #3E504F #3E3F50
monochromatic
#110F0D #2E2823 #50463E #726459 #948275
Accessibility & contrast
On white
9.18
#50463E on #FFFFFF
AA ✓AA large ✓AAA ✓
On black
2.29
#50463E on #000000
AA ✗AA large ✗AAA ✗
Best text color
#FFFFFF on #50463E
9.18:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##50463E | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##50463E | 1.00 | 9.18 | 2.29 | 9.18 |
| #FFFFFF | 9.18 | 1.00 | 21.00 | 1.00 |
| #000000 | 2.29 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 9.18 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#49463E
Deuteranopia (green-blind)
#4B493E
Tritanopia (blue-blind)
#534444
Achromatopsia (no color)
#484848
Design tokens & code
CSS
--color: #50463e; /* rgb */ color: rgb(80, 70, 62); /* oklch */ color: oklch(40.2% 0.019 60.9);
Tailwind
colors: {
custom: {
50: '#817973',
500: '#50463e',
950: '#000000',
},
}SCSS
$custom: #50463e; $custom-light: #817973; $custom-dark: #000000;
JSON
{
"hex": "#50463e",
"rgb": {
"r": 80,
"g": 70,
"b": 62
},
"hsl": {
"h": 26.667,
"s": 12.676,
"l": 27.843
},
"oklch": {
"l": 0.40174,
"c": 0.01892,
"h": 60.9
},
"luminance": 0.06434
}Semantic roles & 50–950 ramp
primary
#50463E
secondary
#6B767F
accent
#98B672
background
#F7F7F6
surface
#EEEDEC
border
#C9C8C7
text
#0A0908
muted
#7C7B7B