#FEBD65#FEBD65
#FEBD65 is a very light, vivid orange. Relative luminance 0.584; OKLCH L 84.1% C 0.129 H 72.8°. Best body text is #000000 at 12.68:1 contrast (WCAG AA passes).
Color values
| HEX | #FEBD65 |
|---|---|
| RGB | rgb(254, 189, 101) |
| HSL | hsl(35, 99%, 70%) |
| HSV | hsv(35, 60%, 100%) |
| CMYK | cmyk(0%, 25.6%, 60.2%, 0.4%) |
| CIE-LAB | lab(80.97, 14.32, 52.84) |
| CIE-LCH | lch(80.97, 54.74, 74.83°) |
| OKLab | oklab(84.12% 0.0381 0.1231) |
| OKLCH | oklch(84.12% 0.129 72.8) |
| XYZ | xyz(61.4232, 58.4101, 20.3486) |
| Luminance | 0.5841 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Butterscotch
#FDB147
ΔE00 3.76
Light Orange
#FDAA48
ΔE00 5.47
Macaroni And Cheese
#EFB435
ΔE00 6.65
Apricot (survey)
#FFB16D
ΔE00 6.66
Mango
#FFA62B
ΔE00 7.01
Yellowish Orange
#FFAB0F
ΔE00 7.23
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#FEBD65 #65A6FE
analogous
#FE7165 #FEBD65 #F2FE65
triadic
#FEBD65 #65FEBD #BD65FE
tetradic
#FEBD65 #65FE71 #65A6FE #FE65F2
square
#FEBD65 #65FE71 #65A6FE #FE65F2
split-complementary
#FEBD65 #65F2FE #7165FE
monochromatic
#E78602 #FEA328 #FEBD65 #FED7A2 #FFF1DF
Accessibility & contrast
On white
1.66
#FEBD65 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
12.68
#FEBD65 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #FEBD65
12.68:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##FEBD65 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##FEBD65 | 1.00 | 1.66 | 12.68 | 12.68 |
| #FFFFFF | 1.66 | 1.00 | 21.00 | 21.00 |
| #000000 | 12.68 | 21.00 | 1.00 | 1.00 |
| ##000000 | 12.68 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#D4C05D
Deuteranopia (green-blind)
#E4CF67
Tritanopia (blue-blind)
#FFACA9
Achromatopsia (no color)
#C9C9C9
Design tokens & code
CSS
--color: #febd65; /* rgb */ color: rgb(254, 189, 101); /* oklch */ color: oklch(84.1% 0.129 72.8);
Tailwind
colors: {
custom: {
50: '#ffd093',
500: '#febd65',
950: '#000000',
},
}SCSS
$custom: #febd65; $custom-light: #ffd093; $custom-dark: #000000;
JSON
{
"hex": "#febd65",
"rgb": {
"r": 254,
"g": 189,
"b": 101
},
"hsl": {
"h": 34.51,
"s": 98.71,
"l": 69.608
},
"oklch": {
"l": 0.84121,
"c": 0.12883,
"h": 72.8
},
"luminance": 0.58406
}Semantic roles & 50–950 ramp
primary
#FEBD65
secondary
#2E77D9
accent
#61E600
background
#FFFEFC
surface
#FFFBF4
border
#D7D4CE
text
#19140D
muted
#87837F