#F4F0EC#F4F0EC
#F4F0EC is a very light, near-neutral orange. Relative luminance 0.876; OKLCH L 95.7% C 0.007 H 67.8°. Best body text is #000000 at 18.52:1 contrast (WCAG AA passes).
Color values
| HEX | #F4F0EC |
|---|---|
| RGB | rgb(244, 240, 236) |
| HSL | hsl(30, 27%, 94%) |
| HSV | hsv(30, 3%, 96%) |
| CMYK | cmyk(0%, 1.6%, 3.3%, 4.3%) |
| CIE-LAB | lab(95.00, 0.64, 2.40) |
| CIE-LCH | lch(95.00, 2.49, 75.01°) |
| OKLab | oklab(95.71% 0.0026 0.0064) |
| OKLCH | oklch(95.71% 0.007 67.8) |
| XYZ | xyz(83.6064, 87.6097, 91.8465) |
| Luminance | 0.8761 (WCAG relative) |
| Temperature | warm |
| Family | orange |
Closest named colors
Off White
#FAF9F6
ΔE00 2.25
Whitesmoke
#F5F5F5
ΔE00 2.61
Seashell
#FFF5EE
ΔE00 2.96
Snow
#FFFAFA
ΔE00 3.15
Linen
#FAF0E6
ΔE00 3.27
Floralwhite
#FFFAF0
ΔE00 3.40
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#F4F0EC #ECF0F4
analogous
#F4ECEC #F4F0EC #F4F4EC
triadic
#F4F0EC #ECF4F0 #F0ECF4
tetradic
#F4F0EC #ECF4EC #ECF0F4 #F4ECF4
square
#F4F0EC #ECF4EC #ECF0F4 #F4ECF4
split-complementary
#F4F0EC #ECF4F4 #ECECF4
monochromatic
#C7B39E #DED1C5 #F4F0EC #F4F0EC #F4F0EC
Accessibility & contrast
On white
1.13
#F4F0EC on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
18.52
#F4F0EC on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #F4F0EC
18.52:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##F4F0EC | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##F4F0EC | 1.00 | 1.13 | 18.52 | 18.52 |
| #FFFFFF | 1.13 | 1.00 | 21.00 | 21.00 |
| #000000 | 18.52 | 21.00 | 1.00 | 1.00 |
| ##000000 | 18.52 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#F1F0EC
Deuteranopia (green-blind)
#F2F1EC
Tritanopia (blue-blind)
#F6EFEF
Achromatopsia (no color)
#F1F1F1
Design tokens & code
CSS
--color: #f4f0ec; /* rgb */ color: rgb(244, 240, 236); /* oklch */ color: oklch(95.7% 0.007 67.8);
Tailwind
colors: {
custom: {
50: '#f7f4f2',
500: '#f4f0ec',
950: '#000000',
},
}SCSS
$custom: #f4f0ec; $custom-light: #f7f4f2; $custom-dark: #000000;
JSON
{
"hex": "#f4f0ec",
"rgb": {
"r": 244,
"g": 240,
"b": 236
},
"hsl": {
"h": 30,
"s": 26.667,
"l": 94.118
},
"oklch": {
"l": 0.95712,
"c": 0.00687,
"h": 67.8
},
"luminance": 0.87609
}Semantic roles & 50–950 ramp
primary
#F4F0EC
secondary
#B7C2CD
accent
#73A540
background
#FFFFFF
surface
#FEFEFE
border
#D6D6D6
text
#171716
muted
#858585