#BFB18C#BFB18C
#BFB18C is a light, muted orange. Relative luminance 0.444; OKLCH L 76.3% C 0.053 H 89.8°. Best body text is #000000 at 9.88:1 contrast (WCAG AA passes).
Color values
| HEX | #BFB18C |
|---|---|
| RGB | rgb(191, 177, 140) |
| HSL | hsl(44, 28%, 65%) |
| HSV | hsv(44, 27%, 75%) |
| CMYK | cmyk(0%, 7.3%, 26.7%, 25.1%) |
| CIE-LAB | lab(72.51, -0.83, 20.78) |
| CIE-LCH | lch(72.51, 20.80, 92.27°) |
| OKLab | oklab(76.27% 0.0002 0.0528) |
| OKLCH | oklch(76.27% 0.053 89.8) |
| XYZ | xyz(41.9419, 44.4151, 31.1694) |
| Luminance | 0.4441 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Putty
#BEAE8A
ΔE00 1.21
Sand
#C2B280
ΔE00 3.37
Khaki
#C3B091
ΔE00 3.38
Bland
#AFA88B
ΔE00 4.41
Stone (survey)
#ADA587
ΔE00 4.66
Toupe
#C7AC7D
ΔE00 4.92
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#BFB18C #8C9ABF
analogous
#BF978C #BFB18C #B4BF8C
triadic
#BFB18C #8CBFB1 #B18CBF
tetradic
#BFB18C #8CBF97 #8C9ABF #BF8CB4
square
#BFB18C #8CBF97 #8C9ABF #BF8CB4
split-complementary
#BFB18C #8CB4BF #978CBF
monochromatic
#86764B #A99665 #BFB18C #D5CCB3 #EBE6DB
Accessibility & contrast
On white
2.12
#BFB18C on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
9.88
#BFB18C on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #BFB18C
9.88:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##BFB18C | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##BFB18C | 1.00 | 2.12 | 9.88 | 9.88 |
| #FFFFFF | 2.12 | 1.00 | 21.00 | 21.00 |
| #000000 | 9.88 | 21.00 | 1.00 | 1.00 |
| ##000000 | 9.88 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#BAAF8A
Deuteranopia (green-blind)
#BDB48D
Tritanopia (blue-blind)
#C7ABA7
Achromatopsia (no color)
#B2B2B2
Design tokens & code
CSS
--color: #bfb18c; /* rgb */ color: rgb(191, 177, 140); /* oklch */ color: oklch(76.3% 0.053 89.8);
Tailwind
colors: {
custom: {
50: '#d3c8ad',
500: '#bfb18c',
950: '#000000',
},
}SCSS
$custom: #bfb18c; $custom-light: #d3c8ad; $custom-dark: #000000;
JSON
{
"hex": "#bfb18c",
"rgb": {
"r": 191,
"g": 177,
"b": 140
},
"hsl": {
"h": 43.529,
"s": 28.492,
"l": 64.902
},
"oklch": {
"l": 0.76274,
"c": 0.05277,
"h": 89.8
},
"luminance": 0.44414
}Semantic roles & 50–950 ramp
primary
#BFB18C
secondary
#CBCFDC
accent
#5BA73E
background
#FCFCFA
surface
#F9F8F4
border
#D2D1CE
text
#141310
muted
#82827F