#B87243#B87243
#B87243 is a mid, moderate orange. Relative luminance 0.226; OKLCH L 61.8% C 0.108 H 53.2°. Best body text is #000000 at 5.53:1 contrast (WCAG AA passes).
Color values
| HEX | #B87243 |
|---|---|
| RGB | rgb(184, 114, 67) |
| HSL | hsl(24, 47%, 49%) |
| HSV | hsv(24, 64%, 72%) |
| CMYK | cmyk(0%, 38%, 63.6%, 27.8%) |
| CIE-LAB | lab(54.69, 23.16, 37.20) |
| CIE-LCH | lch(54.69, 43.82, 58.09°) |
| OKLab | oklab(61.8% 0.0649 0.0868) |
| OKLCH | oklch(61.8% 0.108 53.2) |
| XYZ | xyz(26.7995, 22.6328, 8.2663) |
| Luminance | 0.2263 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Clay Brown
#B2713D
ΔE00 2.34
Copper
#B87333
ΔE00 4.22
Adobe
#BD6C48
ΔE00 4.68
Copper (survey)
#B66325
ΔE00 5.40
Terracotta
#C96F4A
ΔE00 5.97
Earth
#A2653E
ΔE00 6.30
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#B87243 #4389B8
analogous
#B8434E #B87243 #B8AD43
triadic
#B87243 #43B872 #7243B8
tetradic
#B87243 #4EB843 #4389B8 #AD43B8
square
#B87243 #4EB843 #4389B8 #AD43B8
split-complementary
#B87243 #43B8AD #434EB8
monochromatic
#5E3A22 #8B5633 #B87243 #CA936E #DBB49B
Accessibility & contrast
On white
3.80
#B87243 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.53
#B87243 on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #B87243
5.53:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##B87243 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##B87243 | 1.00 | 3.80 | 5.53 | 5.53 |
| #FFFFFF | 3.80 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.53 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.53 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#86793F
Deuteranopia (green-blind)
#978943
Tritanopia (blue-blind)
#C86467
Achromatopsia (no color)
#838383
Design tokens & code
CSS
--color: #b87243; /* rgb */ color: rgb(184, 114, 67); /* oklch */ color: oklch(61.8% 0.108 53.2);
Tailwind
colors: {
custom: {
50: '#d29b78',
500: '#b87243',
950: '#000000',
},
}SCSS
$custom: #b87243; $custom-light: #d29b78; $custom-dark: #000000;
JSON
{
"hex": "#b87243",
"rgb": {
"r": 184,
"g": 114,
"b": 67
},
"hsl": {
"h": 24.103,
"s": 46.614,
"l": 49.216
},
"oklch": {
"l": 0.61802,
"c": 0.10836,
"h": 53.2
},
"luminance": 0.2263
}Semantic roles & 50–950 ramp
primary
#B87243
secondary
#90B1C7
accent
#A1D652
background
#FDF9F7
surface
#FAF2ED
border
#D3CCC8
text
#150E09
muted
#837E7B