#DFB679#DFB679
#DFB679 is a light, moderate orange. Relative luminance 0.505; OKLCH L 79.9% C 0.092 H 76.8°. Best body text is #000000 at 11.10:1 contrast (WCAG AA passes).
Color values
| HEX | #DFB679 |
|---|---|
| RGB | rgb(223, 182, 121) |
| HSL | hsl(36, 61%, 67%) |
| HSV | hsv(36, 46%, 87%) |
| CMYK | cmyk(0%, 18.4%, 45.7%, 12.5%) |
| CIE-LAB | lab(76.39, 7.03, 36.55) |
| CIE-LCH | lch(76.39, 37.22, 79.11°) |
| OKLab | oklab(79.91% 0.021 0.0891) |
| OKLCH | oklch(79.91% 0.092 76.8) |
| XYZ | xyz(50.6124, 50.5270, 25.1723) |
| Luminance | 0.5052 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Burlywood
#DEB887
ΔE00 2.78
Fawn
#CFAF7B
ΔE00 3.57
Very Light Brown
#D3B683
ΔE00 3.66
Tan (survey)
#D1B26F
ΔE00 4.07
Sandstone
#C9AE74
ΔE00 5.06
Tan
#D2B48C
ΔE00 5.23
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#DFB679 #79A2DF
analogous
#DF8379 #DFB679 #D5DF79
triadic
#DFB679 #79DFB6 #B679DF
tetradic
#DFB679 #79DF83 #79A2DF #DF79D5
square
#DFB679 #79DF83 #79A2DF #DF79D5
split-complementary
#DFB679 #79D5DF #8379DF
monochromatic
#B37C2B #D39B48 #DFB679 #EBD1AA #F7ECDC
Accessibility & contrast
On white
1.89
#DFB679 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
11.10
#DFB679 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #DFB679
11.10:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##DFB679 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##DFB679 | 1.00 | 1.89 | 11.10 | 11.10 |
| #FFFFFF | 1.89 | 1.00 | 21.00 | 21.00 |
| #000000 | 11.10 | 21.00 | 1.00 | 1.00 |
| ##000000 | 11.10 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#C6B774
Deuteranopia (green-blind)
#D0C17B
Tritanopia (blue-blind)
#EEABA7
Achromatopsia (no color)
#BCBCBC
Design tokens & code
CSS
--color: #dfb679; /* rgb */ color: rgb(223, 182, 121); /* oklch */ color: oklch(79.9% 0.092 76.8);
Tailwind
colors: {
custom: {
50: '#ebcba0',
500: '#dfb679',
950: '#000000',
},
}SCSS
$custom: #dfb679; $custom-light: #ebcba0; $custom-dark: #000000;
JSON
{
"hex": "#dfb679",
"rgb": {
"r": 223,
"g": 182,
"b": 121
},
"hsl": {
"h": 35.882,
"s": 61.446,
"l": 67.451
},
"oklch": {
"l": 0.79912,
"c": 0.09156,
"h": 76.8
},
"luminance": 0.50524
}Semantic roles & 50–950 ramp
primary
#DFB679
secondary
#4873B4
accent
#62C91C
background
#FFFDFC
surface
#FEF9F5
border
#D6D2CF
text
#16130F
muted
#858280