#CFB680#CFB680
#CFB680 is a light, moderate orange. Relative luminance 0.483; OKLCH L 78.5% C 0.076 H 85.8°. Best body text is #000000 at 10.66:1 contrast (WCAG AA passes).
Color values
| HEX | #CFB680 |
|---|---|
| RGB | rgb(207, 182, 128) |
| HSL | hsl(41, 45%, 66%) |
| HSV | hsv(41, 38%, 81%) |
| CMYK | cmyk(0%, 12.1%, 38.2%, 18.8%) |
| CIE-LAB | lab(75.00, 1.33, 30.79) |
| CIE-LCH | lch(75.00, 30.82, 87.53°) |
| OKLab | oklab(78.51% 0.0056 0.0763) |
| OKLCH | oklch(78.51% 0.076 85.8) |
| XYZ | xyz(46.3574, 48.2816, 27.2953) |
| Luminance | 0.4828 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Very Light Brown
#D3B683
ΔE00 1.73
Sandstone
#C9AE74
ΔE00 2.35
Fawn
#CFAF7B
ΔE00 2.92
Tan (survey)
#D1B26F
ΔE00 3.11
Toupe
#C7AC7D
ΔE00 3.25
Sand
#C2B280
ΔE00 3.34
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#CFB680 #8099CF
analogous
#CF8E80 #CFB680 #C0CF80
triadic
#CFB680 #80CFB6 #B680CF
tetradic
#CFB680 #80CF8E #8099CF #CF80C0
square
#CFB680 #80CF8E #8099CF #CF80C0
split-complementary
#CFB680 #80C0CF #8E80CF
monochromatic
#9A7C3A #BE9C54 #CFB680 #E0D0AC #F1E9D9
Accessibility & contrast
On white
1.97
#CFB680 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
10.66
#CFB680 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #CFB680
10.66:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##CFB680 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##CFB680 | 1.00 | 1.97 | 10.66 | 10.66 |
| #FFFFFF | 1.97 | 1.00 | 21.00 | 21.00 |
| #000000 | 10.66 | 21.00 | 1.00 | 1.00 |
| ##000000 | 10.66 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#C3B57C
Deuteranopia (green-blind)
#C9BB82
Tritanopia (blue-blind)
#DBADA8
Achromatopsia (no color)
#B9B9B9
Design tokens & code
CSS
--color: #cfb680; /* rgb */ color: rgb(207, 182, 128); /* oklch */ color: oklch(78.5% 0.076 85.8);
Tailwind
colors: {
custom: {
50: '#dfcba5',
500: '#cfb680',
950: '#000000',
},
}SCSS
$custom: #cfb680; $custom-light: #dfcba5; $custom-dark: #000000;
JSON
{
"hex": "#cfb680",
"rgb": {
"r": 207,
"g": 182,
"b": 128
},
"hsl": {
"h": 41.013,
"s": 45.143,
"l": 65.686
},
"oklch": {
"l": 0.78506,
"c": 0.07649,
"h": 85.8
},
"luminance": 0.4828
}Semantic roles & 50–950 ramp
primary
#CFB680
secondary
#C8D1E3
accent
#59B82D
background
#FDFCFA
surface
#FBF8F4
border
#D4D1CE
text
#15130F
muted
#83827F