#B8917A#B8917A
#B8917A is a light, muted orange. Relative luminance 0.318; OKLCH L 68.7% C 0.058 H 52.0°. Best body text is #000000 at 7.37:1 contrast (WCAG AA passes).
Color values
| HEX | #B8917A |
|---|---|
| RGB | rgb(184, 145, 122) |
| HSL | hsl(22, 30%, 60%) |
| HSV | hsv(22, 34%, 72%) |
| CMYK | cmyk(0%, 21.2%, 33.7%, 27.8%) |
| CIE-LAB | lab(63.22, 11.41, 17.82) |
| CIE-LCH | lch(63.22, 21.16, 57.38°) |
| OKLab | oklab(68.72% 0.0354 0.0453) |
| OKLCH | oklch(68.72% 0.058 52) |
| XYZ | xyz(33.4062, 31.8479, 22.7962) |
| Luminance | 0.3185 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Mushroom
#BA9E88
ΔE00 5.06
Pale Brown
#B1916E
ΔE00 6.04
Pinkish Tan
#D99B82
ΔE00 7.51
Camel
#C19A6B
ΔE00 8.41
Taupe (survey)
#B9A281
ΔE00 9.39
Light Brown
#AD8150
ΔE00 9.68
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#B8917A #7AA1B8
analogous
#B87A82 #B8917A #B8B07A
triadic
#B8917A #7AB891 #917AB8
tetradic
#B8917A #82B87A #7AA1B8 #B07AB8
square
#B8917A #82B87A #7AA1B8 #B07AB8
split-complementary
#B8917A #7AB8B0 #7A82B8
monochromatic
#785540 #A07155 #B8917A #CDB2A2 #E3D3CA
Accessibility & contrast
On white
2.85
#B8917A on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
7.37
#B8917A on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #B8917A
7.37:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##B8917A | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##B8917A | 1.00 | 2.85 | 7.37 | 7.37 |
| #FFFFFF | 2.85 | 1.00 | 21.00 | 21.00 |
| #000000 | 7.37 | 21.00 | 1.00 | 1.00 |
| ##000000 | 7.37 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#9C9478
Deuteranopia (green-blind)
#A59C7A
Tritanopia (blue-blind)
#C38A8B
Achromatopsia (no color)
#999999
Design tokens & code
CSS
--color: #b8917a; /* rgb */ color: rgb(184, 145, 122); /* oklch */ color: oklch(68.7% 0.058 52.0);
Tailwind
colors: {
custom: {
50: '#ceb1a0',
500: '#b8917a',
950: '#000000',
},
}SCSS
$custom: #b8917a; $custom-light: #ceb1a0; $custom-dark: #000000;
JSON
{
"hex": "#b8917a",
"rgb": {
"r": 184,
"g": 145,
"b": 122
},
"hsl": {
"h": 22.258,
"s": 30.392,
"l": 60
},
"oklch": {
"l": 0.6872,
"c": 0.05753,
"h": 52
},
"luminance": 0.31846
}Semantic roles & 50–950 ramp
primary
#B8917A
secondary
#BBCAD3
accent
#A1C761
background
#FCFAF9
surface
#F9F5F2
border
#D2CFCC
text
#14100E
muted
#827F7E