#F29A64#F29A64
#F29A64 is a light, vivid orange. Relative luminance 0.429; OKLCH L 76.5% C 0.127 H 51.4°. Best body text is #000000 at 9.58:1 contrast (WCAG AA passes).
Color values
| HEX | #F29A64 |
|---|---|
| RGB | rgb(242, 154, 100) |
| HSL | hsl(23, 85%, 67%) |
| HSV | hsv(23, 59%, 95%) |
| CMYK | cmyk(0%, 36.4%, 58.7%, 5.1%) |
| CIE-LAB | lab(71.50, 27.77, 41.75) |
| CIE-LCH | lch(71.50, 50.14, 56.37°) |
| OKLab | oklab(76.46% 0.079 0.099) |
| OKLCH | oklch(76.46% 0.127 51.4) |
| XYZ | xyz(50.4772, 42.9132, 17.6788) |
| Luminance | 0.4291 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Pastel Orange
#FF964F
ΔE00 3.74
Faded Orange
#F0944D
ΔE00 3.93
Orangeish
#FD8D49
ΔE00 4.48
Sandybrown
#F4A460
ΔE00 4.91
Peach (survey)
#FFB07C
ΔE00 5.44
Lightsalmon
#FFA07A
ΔE00 5.66
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#F29A64 #64BCF2
analogous
#F26475 #F29A64 #F2E164
triadic
#F29A64 #64F29A #9A64F2
tetradic
#F29A64 #75F264 #64BCF2 #E164F2
square
#F29A64 #75F264 #64BCF2 #E164F2
split-complementary
#F29A64 #64F2E1 #6475F2
monochromatic
#CB5811 #ED752C #F29A64 #F7BF9C #FBE4D5
Accessibility & contrast
On white
2.19
#F29A64 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
9.58
#F29A64 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #F29A64
9.58:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##F29A64 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##F29A64 | 1.00 | 2.19 | 9.58 | 9.58 |
| #FFFFFF | 2.19 | 1.00 | 21.00 | 21.00 |
| #000000 | 9.58 | 21.00 | 1.00 | 1.00 |
| ##000000 | 9.58 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#B3A35F
Deuteranopia (green-blind)
#C8B764
Tritanopia (blue-blind)
#FF898D
Achromatopsia (no color)
#AFAFAF
Design tokens & code
CSS
--color: #f29a64; /* rgb */ color: rgb(242, 154, 100); /* oklch */ color: oklch(76.5% 0.127 51.4);
Tailwind
colors: {
custom: {
50: '#fbb891',
500: '#f29a64',
950: '#000000',
},
}SCSS
$custom: #f29a64; $custom-light: #fbb891; $custom-dark: #000000;
JSON
{
"hex": "#f29a64",
"rgb": {
"r": 242,
"g": 154,
"b": 100
},
"hsl": {
"h": 22.817,
"s": 84.524,
"l": 67.059
},
"oklch": {
"l": 0.76461,
"c": 0.12662,
"h": 51.4
},
"luminance": 0.42909
}Semantic roles & 50–950 ramp
primary
#F29A64
secondary
#C2DEEF
accent
#8DE105
background
#FFFBF9
surface
#FFF6F1
border
#D7D0CB
text
#18110D
muted
#86807E