#F79E67#F79E67
#F79E67 is a light, vivid orange. Relative luminance 0.452; OKLCH L 77.8% C 0.128 H 51.6°. Best body text is #000000 at 10.04:1 contrast (WCAG AA passes).
Color values
| HEX | #F79E67 |
|---|---|
| RGB | rgb(247, 158, 103) |
| HSL | hsl(23, 90%, 69%) |
| HSV | hsv(23, 58%, 97%) |
| CMYK | cmyk(0%, 36%, 58.3%, 3.1%) |
| CIE-LAB | lab(73.03, 27.88, 42.21) |
| CIE-LCH | lch(73.03, 50.59, 56.55°) |
| OKLab | oklab(77.79% 0.0794 0.1002) |
| OKLCH | oklch(77.79% 0.128 51.6) |
| XYZ | xyz(53.0364, 45.2120, 18.7629) |
| Luminance | 0.4521 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Pastel Orange
#FF964F
ΔE00 3.65
Faded Orange
#F0944D
ΔE00 4.34
Peach (survey)
#FFB07C
ΔE00 4.43
Sandybrown
#F4A460
ΔE00 4.49
Orangeish
#FD8D49
ΔE00 4.85
Lightsalmon
#FFA07A
ΔE00 5.41
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#F79E67 #67C0F7
analogous
#F76778 #F79E67 #F7E667
triadic
#F79E67 #67F79E #9E67F7
tetradic
#F79E67 #78F767 #67C0F7 #E667F7
square
#F79E67 #78F767 #67C0F7 #E667F7
split-complementary
#F79E67 #67F7E6 #6778F7
monochromatic
#D85A0B #F4792D #F79E67 #FAC3A1 #FDE8DB
Accessibility & contrast
On white
2.09
#F79E67 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
10.04
#F79E67 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #F79E67
10.04:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##F79E67 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##F79E67 | 1.00 | 2.09 | 10.04 | 10.04 |
| #FFFFFF | 2.09 | 1.00 | 21.00 | 21.00 |
| #000000 | 10.04 | 21.00 | 1.00 | 1.00 |
| ##000000 | 10.04 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#B7A762
Deuteranopia (green-blind)
#CCBB67
Tritanopia (blue-blind)
#FF8D91
Achromatopsia (no color)
#B3B3B3
Design tokens & code
CSS
--color: #f79e67; /* rgb */ color: rgb(247, 158, 103); /* oklch */ color: oklch(77.8% 0.128 51.6);
Tailwind
colors: {
custom: {
50: '#febb93',
500: '#f79e67',
950: '#000000',
},
}SCSS
$custom: #f79e67; $custom-light: #febb93; $custom-dark: #000000;
JSON
{
"hex": "#f79e67",
"rgb": {
"r": 247,
"g": 158,
"b": 103
},
"hsl": {
"h": 22.917,
"s": 90,
"l": 68.627
},
"oklch": {
"l": 0.77789,
"c": 0.12779,
"h": 51.6
},
"luminance": 0.45207
}Semantic roles & 50–950 ramp
primary
#F79E67
secondary
#C7E2F2
accent
#8EE600
background
#FFFBF9
surface
#FFF6F1
border
#D7D0CB
text
#18120D
muted
#86817E