#FBAC5E#FBAC5E
#FBAC5E is a light, vivid orange. Relative luminance 0.508; OKLCH L 80.6% C 0.132 H 63.6°. Best body text is #000000 at 11.16:1 contrast (WCAG AA passes).
Color values
| HEX | #FBAC5E |
|---|---|
| RGB | rgb(251, 172, 94) |
| HSL | hsl(30, 95%, 68%) |
| HSV | hsv(30, 63%, 98%) |
| CMYK | cmyk(0%, 31.5%, 62.5%, 1.6%) |
| CIE-LAB | lab(76.57, 21.53, 51.04) |
| CIE-LCH | lch(76.57, 55.39, 67.13°) |
| OKLab | oklab(80.6% 0.0588 0.1184) |
| OKLCH | oklch(80.6% 0.132 63.6) |
| XYZ | xyz(56.5603, 50.8272, 17.4193) |
| Luminance | 0.5082 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Pale Orange
#FFA756
ΔE00 1.96
Apricot (survey)
#FFB16D
ΔE00 2.38
Sandybrown
#F4A460
ΔE00 3.00
Light Orange
#FDAA48
ΔE00 3.18
Butterscotch
#FDB147
ΔE00 5.29
Mango
#FFA62B
ΔE00 5.87
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#FBAC5E #5EADFB
analogous
#FB5E5E #FBAC5E #FBFB5E
triadic
#FBAC5E #5EFBAC #AC5EFB
tetradic
#FBAC5E #5EFB5E #5EADFB #FB5EFB
square
#FBAC5E #5EFB5E #5EADFB #FB5EFB
split-complementary
#FBAC5E #5EFBFB #5E5EFB
monochromatic
#D96F05 #FA8D22 #FBAC5E #FCCB9A #FEEAD5
Accessibility & contrast
On white
1.88
#FBAC5E on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
11.16
#FBAC5E on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #FBAC5E
11.16:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##FBAC5E | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##FBAC5E | 1.00 | 1.88 | 11.16 | 11.16 |
| #FFFFFF | 1.88 | 1.00 | 21.00 | 21.00 |
| #000000 | 11.16 | 21.00 | 1.00 | 1.00 |
| ##000000 | 11.16 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#C5B256
Deuteranopia (green-blind)
#D8C45F
Tritanopia (blue-blind)
#FF9A9A
Achromatopsia (no color)
#BDBDBD
Design tokens & code
CSS
--color: #fbac5e; /* rgb */ color: rgb(251, 172, 94); /* oklch */ color: oklch(80.6% 0.132 63.6);
Tailwind
colors: {
custom: {
50: '#ffc48e',
500: '#fbac5e',
950: '#000000',
},
}SCSS
$custom: #fbac5e; $custom-light: #ffc48e; $custom-dark: #000000;
JSON
{
"hex": "#fbac5e",
"rgb": {
"r": 251,
"g": 172,
"b": 94
},
"hsl": {
"h": 29.809,
"s": 95.152,
"l": 67.647
},
"oklch": {
"l": 0.80601,
"c": 0.13217,
"h": 63.6
},
"luminance": 0.50822
}Semantic roles & 50–950 ramp
primary
#FBAC5E
secondary
#2A7FD3
accent
#73E600
background
#FFFDFC
surface
#FFF9F4
border
#D7D2CE
text
#19120C
muted
#87827F