#B8795D#B8795D
#B8795D is a light, moderate orange. Relative luminance 0.247; OKLCH L 63.5% C 0.089 H 44.7°. Best body text is #000000 at 5.93:1 contrast (WCAG AA passes).
Color values
| HEX | #B8795D |
|---|---|
| RGB | rgb(184, 121, 93) |
| HSL | hsl(18, 39%, 54%) |
| HSV | hsv(18, 49%, 72%) |
| CMYK | cmyk(0%, 34.2%, 49.5%, 27.8%) |
| CIE-LAB | lab(56.74, 21.45, 25.42) |
| CIE-LCH | lch(56.74, 33.26, 49.85°) |
| OKLab | oklab(63.51% 0.0633 0.0626) |
| OKLCH | oklch(63.51% 0.089 44.7) |
| XYZ | xyz(28.5819, 24.6577, 13.6079) |
| Luminance | 0.2465 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Pinkish Brown
#B17261
ΔE00 4.64
Adobe
#BD6C48
ΔE00 4.82
Clay
#B66A50
ΔE00 4.97
Terracotta
#C96F4A
ΔE00 5.40
Terracota
#CB6843
ΔE00 7.04
Brownish
#9C6D57
ΔE00 7.13
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#B8795D #5D9CB8
analogous
#B85D6F #B8795D #B8A75D
triadic
#B8795D #5DB879 #795DB8
tetradic
#B8795D #6FB85D #5D9CB8 #A75DB8
square
#B8795D #6FB85D #5D9CB8 #A75DB8
split-complementary
#B8795D #5DB8A7 #5D6FB8
monochromatic
#6B422F #965C42 #B8795D #CB9C88 #DDBFB2
Accessibility & contrast
On white
3.54
#B8795D on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.93
#B8795D on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #B8795D
5.93:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##B8795D | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##B8795D | 1.00 | 3.54 | 5.93 | 5.93 |
| #FFFFFF | 3.54 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.93 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.93 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#89805B
Deuteranopia (green-blind)
#988D5D
Tritanopia (blue-blind)
#C66E72
Achromatopsia (no color)
#888888
Design tokens & code
CSS
--color: #b8795d; /* rgb */ color: rgb(184, 121, 93); /* oklch */ color: oklch(63.5% 0.089 44.7);
Tailwind
colors: {
custom: {
50: '#d0a08b',
500: '#b8795d',
950: '#000000',
},
}SCSS
$custom: #b8795d; $custom-light: #d0a08b; $custom-dark: #000000;
JSON
{
"hex": "#b8795d",
"rgb": {
"r": 184,
"g": 121,
"b": 93
},
"hsl": {
"h": 18.462,
"s": 39.056,
"l": 54.314
},
"oklch": {
"l": 0.63511,
"c": 0.08899,
"h": 44.7
},
"luminance": 0.24655
}Semantic roles & 50–950 ramp
primary
#B8795D
secondary
#A5C0CC
accent
#ABCF59
background
#FDF9F8
surface
#FAF2F0
border
#D3CCCB
text
#140E0C
muted
#837E7D