Blood Orange#FE4B03
#FE4B03 is a light, highly saturated orange. Relative luminance 0.261; OKLCH L 66.4% C 0.224 H 36.5°. Best body text is #000000 at 6.22:1 contrast (WCAG AA passes).
Color values
| HEX | #FE4B03 |
|---|---|
| RGB | rgb(254, 75, 3) |
| HSL | hsl(17, 99%, 50%) |
| HSV | hsv(17, 99%, 100%) |
| CMYK | cmyk(0%, 70.5%, 98.8%, 0.4%) |
| CIE-LAB | lab(58.15, 65.46, 68.52) |
| CIE-LCH | lch(58.15, 94.76, 46.31°) |
| OKLab | oklab(66.41% 0.1801 0.1331) |
| OKLCH | oklch(66.41% 0.224 36.5) |
| XYZ | xyz(43.4110, 26.1164, 2.8414) |
| Luminance | 0.2611 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Blood Orange
#FE4B03
ΔE00 0.00
Orangered
#FF4500
ΔE00 0.94
Orangered (survey)
#FE420F
ΔE00 2.42
Red Orange
#FD3C06
ΔE00 2.87
Reddish Orange
#F8481C
ΔE00 3.16
Bright Orange
#FF5B00
ΔE00 3.63
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#FE4B03 #03B6FE
analogous
#FE0339 #FE4B03 #FEC803
triadic
#FE4B03 #03FE4B #4B03FE
tetradic
#FE4B03 #39FE03 #03B6FE #C803FE
square
#FE4B03 #39FE03 #03B6FE #C803FE
split-complementary
#FE4B03 #03FEC8 #0339FE
monochromatic
#862701 #C33801 #FE4B03 #FE7740 #FEA27D
Accessibility & contrast
On white
3.38
#FE4B03 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
6.22
#FE4B03 on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #FE4B03
6.22:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##FE4B03 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##FE4B03 | 1.00 | 3.38 | 6.22 | 6.22 |
| #FFFFFF | 3.38 | 1.00 | 21.00 | 21.00 |
| #000000 | 6.22 | 21.00 | 1.00 | 1.00 |
| ##000000 | 6.22 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#827200
Deuteranopia (green-blind)
#AE9A00
Tritanopia (blue-blind)
#FF0041
Achromatopsia (no color)
#8C8C8C
Design tokens & code
CSS
--color: #fe4b03; /* rgb */ color: rgb(254, 75, 3); /* oklch */ color: oklch(66.4% 0.224 36.5);
Tailwind
colors: {
custom: {
50: '#ff8858',
500: '#fe4b03',
950: '#000000',
},
}SCSS
$custom: #fe4b03; $custom-light: #ff8858; $custom-dark: #000000;
JSON
{
"hex": "#fe4b03",
"rgb": {
"r": 254,
"g": 75,
"b": 3
},
"hsl": {
"h": 17.211,
"s": 99.209,
"l": 50.392
},
"oklch": {
"l": 0.66413,
"c": 0.22393,
"h": 36.5
},
"luminance": 0.2611
}Semantic roles & 50–950 ramp
primary
#FE4B03
secondary
#76C6E6
accent
#C2FF29
background
#FFF8F5
surface
#FFF0E9
border
#D7CBC5
text
#1B0C04
muted
#887D79