#FFCA5D#FFCA5D
#FFCA5D is a very light, vivid orange. Relative luminance 0.643; OKLCH L 86.6% C 0.139 H 83.0°. Best body text is #000000 at 13.86:1 contrast (WCAG AA passes).
Color values
| HEX | #FFCA5D |
|---|---|
| RGB | rgb(255, 202, 93) |
| HSL | hsl(40, 100%, 68%) |
| HSV | hsv(40, 64%, 100%) |
| CMYK | cmyk(0%, 20.8%, 63.5%, 0%) |
| CIE-LAB | lab(84.12, 7.47, 60.13) |
| CIE-LCH | lch(84.12, 60.59, 82.92°) |
| OKLab | oklab(86.59% 0.017 0.1377) |
| OKLCH | oklch(86.59% 0.139 83) |
| XYZ | xyz(64.3399, 64.2956, 19.3753) |
| Luminance | 0.6429 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Maize
#F4D054
ΔE00 5.46
Sunflower
#FFC512
ΔE00 5.50
Golden Yellow
#FEC615
ΔE00 5.54
Macaroni And Cheese
#EFB435
ΔE00 5.57
Marigold
#FCC006
ΔE00 5.71
Amber
#FFBF00
ΔE00 5.82
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#FFCA5D #5D92FF
analogous
#FF795D #FFCA5D #E3FF5D
triadic
#FFCA5D #5DFFCA #CA5DFF
tetradic
#FFCA5D #5DFF79 #5D92FF #FF5DE3
square
#FFCA5D #5DFF79 #5D92FF #FF5DE3
split-complementary
#FFCA5D #5DE3FF #795DFF
monochromatic
#E29800 #FFB620 #FFCA5D #FFDE9A #FFF2D7
Accessibility & contrast
On white
1.52
#FFCA5D on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
13.86
#FFCA5D on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #FFCA5D
13.86:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##FFCA5D | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##FFCA5D | 1.00 | 1.52 | 13.86 | 13.86 |
| #FFFFFF | 1.52 | 1.00 | 21.00 | 21.00 |
| #000000 | 13.86 | 21.00 | 1.00 | 1.00 |
| ##000000 | 13.86 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#E1CA51
Deuteranopia (green-blind)
#EDD761
Tritanopia (blue-blind)
#FFB9B2
Achromatopsia (no color)
#D2D2D2
Design tokens & code
CSS
--color: #ffca5d; /* rgb */ color: rgb(255, 202, 93); /* oklch */ color: oklch(86.6% 0.139 83.0);
Tailwind
colors: {
custom: {
50: '#ffd98f',
500: '#ffca5d',
950: '#000000',
},
}SCSS
$custom: #ffca5d; $custom-light: #ffd98f; $custom-dark: #000000;
JSON
{
"hex": "#ffca5d",
"rgb": {
"r": 255,
"g": 202,
"b": 93
},
"hsl": {
"h": 40.37,
"s": 100,
"l": 68.235
},
"oklch": {
"l": 0.86588,
"c": 0.1387,
"h": 83
},
"luminance": 0.64291
}Semantic roles & 50–950 ramp
primary
#FFCA5D
secondary
#2761D9
accent
#4BE600
background
#FFFEFC
surface
#FFFBF4
border
#D7D4CE
text
#19140D
muted
#87837F