#CE983A#CE983A
#CE983A is a light, vivid orange. Relative luminance 0.359; OKLCH L 71.5% C 0.126 H 77.8°. Best body text is #000000 at 8.18:1 contrast (WCAG AA passes).
Color values
| HEX | #CE983A |
|---|---|
| RGB | rgb(206, 152, 58) |
| HSL | hsl(38, 60%, 52%) |
| HSV | hsv(38, 72%, 81%) |
| CMYK | cmyk(0%, 26.2%, 71.8%, 19.2%) |
| CIE-LAB | lab(66.43, 11.23, 55.15) |
| CIE-LCH | lch(66.43, 56.28, 78.48°) |
| OKLab | oklab(71.48% 0.0266 0.123) |
| OKLCH | oklch(71.48% 0.126 77.8) |
| XYZ | xyz(37.4480, 35.8867, 8.9567) |
| Luminance | 0.3588 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Camel (survey)
#C69F59
ΔE00 4.93
Ochre
#BF9005
ΔE00 5.56
Goldenrod
#DAA520
ΔE00 5.77
Sand Brown
#CBA560
ΔE00 5.89
Yellow Ochre
#CB9D06
ΔE00 6.07
Caramel
#C68E4E
ΔE00 6.39
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#CE983A #3A70CE
analogous
#CE4E3A #CE983A #BACE3A
triadic
#CE983A #3ACE98 #983ACE
tetradic
#CE983A #3ACE4E #3A70CE #CE3ABA
square
#CE983A #3ACE4E #3A70CE #CE3ABA
split-complementary
#CE983A #3ABACE #4E3ACE
monochromatic
#71521C #A27628 #CE983A #DAB26B #E6CB9C
Accessibility & contrast
On white
2.57
#CE983A on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
8.18
#CE983A on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #CE983A
8.18:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##CE983A | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##CE983A | 1.00 | 2.57 | 8.18 | 8.18 |
| #FFFFFF | 2.57 | 1.00 | 21.00 | 21.00 |
| #000000 | 8.18 | 21.00 | 1.00 | 1.00 |
| ##000000 | 8.18 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#AD9A2E
Deuteranopia (green-blind)
#B9A73D
Tritanopia (blue-blind)
#E08985
Achromatopsia (no color)
#A1A1A1
Design tokens & code
CSS
--color: #ce983a; /* rgb */ color: rgb(206, 152, 58); /* oklch */ color: oklch(71.5% 0.126 77.8);
Tailwind
colors: {
custom: {
50: '#e2b675',
500: '#ce983a',
950: '#000000',
},
}SCSS
$custom: #ce983a; $custom-light: #e2b675; $custom-dark: #000000;
JSON
{
"hex": "#ce983a",
"rgb": {
"r": 206,
"g": 152,
"b": 58
},
"hsl": {
"h": 38.108,
"s": 60.163,
"l": 51.765
},
"oklch": {
"l": 0.71476,
"c": 0.12584,
"h": 77.8
},
"luminance": 0.35884
}Semantic roles & 50–950 ramp
primary
#CE983A
secondary
#91A9D2
accent
#7EE344
background
#FEFBF7
surface
#FDF6ED
border
#D5D0C8
text
#161109
muted
#84807B