#CA9E3B#CA9E3B
#CA9E3B is a light, vivid orange. Relative luminance 0.373; OKLCH L 72.2% C 0.125 H 84.2°. Best body text is #000000 at 8.47:1 contrast (WCAG AA passes).
Color values
| HEX | #CA9E3B |
|---|---|
| RGB | rgb(202, 158, 59) |
| HSL | hsl(42, 57%, 51%) |
| HSV | hsv(42, 71%, 79%) |
| CMYK | cmyk(0%, 21.8%, 70.8%, 20.8%) |
| CIE-LAB | lab(67.52, 6.30, 55.70) |
| CIE-LCH | lch(67.52, 56.05, 83.54°) |
| OKLab | oklab(72.24% 0.0127 0.1245) |
| OKLCH | oklch(72.24% 0.125 84.2) |
| XYZ | xyz(37.3756, 37.3286, 9.3734) |
| Luminance | 0.3733 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Yellow Ochre
#CB9D06
ΔE00 3.93
Ocre
#C69C04
ΔE00 4.28
Goldenrod
#DAA520
ΔE00 4.34
Camel (survey)
#C69F59
ΔE00 4.50
Ocher
#BF9B0C
ΔE00 4.97
Ochre
#BF9005
ΔE00 5.00
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#CA9E3B #3B67CA
analogous
#CA563B #CA9E3B #AFCA3B
triadic
#CA9E3B #3BCA9E #9E3BCA
tetradic
#CA9E3B #3BCA56 #3B67CA #CA3BAF
square
#CA9E3B #3BCA56 #3B67CA #CA3BAF
split-complementary
#CA9E3B #3BAFCA #563BCA
monochromatic
#6D551E #9D7A2B #CA9E3B #D7B66B #E4CE9B
Accessibility & contrast
On white
2.48
#CA9E3B on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
8.47
#CA9E3B on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #CA9E3B
8.47:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##CA9E3B | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##CA9E3B | 1.00 | 2.48 | 8.47 | 8.47 |
| #FFFFFF | 2.48 | 1.00 | 21.00 | 21.00 |
| #000000 | 8.47 | 21.00 | 1.00 | 1.00 |
| ##000000 | 8.47 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#B19E2E
Deuteranopia (green-blind)
#BCA93F
Tritanopia (blue-blind)
#DB908A
Achromatopsia (no color)
#A4A4A4
Design tokens & code
CSS
--color: #ca9e3b; /* rgb */ color: rgb(202, 158, 59); /* oklch */ color: oklch(72.2% 0.125 84.2);
Tailwind
colors: {
custom: {
50: '#deba76',
500: '#ca9e3b',
950: '#000000',
},
}SCSS
$custom: #ca9e3b; $custom-light: #deba76; $custom-dark: #000000;
JSON
{
"hex": "#ca9e3b",
"rgb": {
"r": 202,
"g": 158,
"b": 59
},
"hsl": {
"h": 41.538,
"s": 57.43,
"l": 51.176
},
"oklch": {
"l": 0.72237,
"c": 0.12515,
"h": 84.2
},
"luminance": 0.37326
}Semantic roles & 50–950 ramp
primary
#CA9E3B
secondary
#91A4D0
accent
#76E147
background
#FEFBF7
surface
#FCF6ED
border
#D5D0C8
text
#161109
muted
#84807B