#BCA796#BCA796
#BCA796 is a light, muted orange. Relative luminance 0.405; OKLCH L 74.2% C 0.034 H 61.3°. Best body text is #000000 at 9.11:1 contrast (WCAG AA passes).
Color values
| HEX | #BCA796 |
|---|---|
| RGB | rgb(188, 167, 150) |
| HSL | hsl(27, 22%, 66%) |
| HSV | hsv(27, 20%, 74%) |
| CMYK | cmyk(0%, 11.2%, 20.2%, 26.3%) |
| CIE-LAB | lab(69.85, 4.86, 11.58) |
| CIE-LCH | lch(69.85, 12.56, 67.23°) |
| OKLab | oklab(74.19% 0.0165 0.0301) |
| OKLCH | oklch(74.19% 0.034 61.3) |
| XYZ | xyz(40.0628, 40.5319, 34.5613) |
| Luminance | 0.4053 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Mushroom
#BA9E88
ΔE00 3.58
Greige
#B8AB98
ΔE00 4.31
Stone
#A89F91
ΔE00 6.13
Taupe (survey)
#B9A281
ΔE00 6.23
Khaki
#C3B091
ΔE00 6.46
Warm Gray
#C9BEB0
ΔE00 7.19
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#BCA796 #96ABBC
analogous
#BC9698 #BCA796 #BCBA96
triadic
#BCA796 #96BCA7 #A796BC
tetradic
#BCA796 #98BC96 #96ABBC #BA96BC
square
#BCA796 #98BC96 #96ABBC #BA96BC
split-complementary
#BCA796 #96BCBA #9698BC
monochromatic
#846954 #A48871 #BCA796 #D4C6BB #ECE6E1
Accessibility & contrast
On white
2.31
#BCA796 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
9.11
#BCA796 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #BCA796
9.11:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##BCA796 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##BCA796 | 1.00 | 2.31 | 9.11 | 9.11 |
| #FFFFFF | 2.31 | 1.00 | 21.00 | 21.00 |
| #000000 | 9.11 | 21.00 | 1.00 | 1.00 |
| ##000000 | 9.11 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#AEA895
Deuteranopia (green-blind)
#B2AC96
Tritanopia (blue-blind)
#C3A3A2
Achromatopsia (no color)
#ABABAB
Design tokens & code
CSS
--color: #bca796; /* rgb */ color: rgb(188, 167, 150); /* oklch */ color: oklch(74.2% 0.034 61.3);
Tailwind
colors: {
custom: {
50: '#d0c1b4',
500: '#bca796',
950: '#000000',
},
}SCSS
$custom: #bca796; $custom-light: #d0c1b4; $custom-dark: #000000;
JSON
{
"hex": "#bca796",
"rgb": {
"r": 188,
"g": 167,
"b": 150
},
"hsl": {
"h": 26.842,
"s": 22.093,
"l": 66.275
},
"oklch": {
"l": 0.74191,
"c": 0.03427,
"h": 61.3
},
"luminance": 0.40531
}Semantic roles & 50–950 ramp
primary
#BCA796
secondary
#D1D8DD
accent
#78A145
background
#FCFBFB
surface
#F9F7F6
border
#D2D0D0
text
#141211
muted
#828180