#E4EAF7#E4EAF7
#E4EAF7 is a very light, near-neutral blue. Relative luminance 0.821; OKLCH L 93.6% C 0.019 H 266.0°. Best body text is #000000 at 17.41:1 contrast (WCAG AA passes).
Color values
| HEX | #E4EAF7 |
|---|---|
| RGB | rgb(228, 234, 247) |
| HSL | hsl(221, 54%, 93%) |
| HSV | hsv(221, 8%, 97%) |
| CMYK | cmyk(7.7%, 5.3%, 0%, 3.1%) |
| CIE-LAB | lab(92.60, 0.42, -6.97) |
| CIE-LCH | lch(92.60, 6.98, 273.49°) |
| OKLab | oklab(93.63% -0.0013 -0.0187) |
| OKLCH | oklch(93.63% 0.019 266) |
| XYZ | xyz(78.2028, 82.0544, 99.6957) |
| Luminance | 0.8206 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Closest named colors
Aliceblue
#F0F8FF
ΔE00 4.29
Ghostwhite
#F8F8FF
ΔE00 4.51
Lavender (CSS)
#E6E6FA
ΔE00 4.60
Fog
#D8DCE0
ΔE00 5.12
Whitesmoke
#F5F5F5
ΔE00 6.49
Gainsboro
#DCDCDC
ΔE00 6.76
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#E4EAF7 #F7F1E4
analogous
#E4F3F7 #E4EAF7 #E7E4F7
triadic
#E4EAF7 #F7E4EA #EAF7E4
tetradic
#E4EAF7 #F7E4F3 #F7F1E4 #E4F7E7
square
#E4EAF7 #F7E4F3 #F7F1E4 #E4F7E7
split-complementary
#E4EAF7 #F7E7E4 #F3F7E4
monochromatic
#86A1DB #B5C5E9 #E4EAF7 #E7EDF8 #E7EDF8
Accessibility & contrast
On white
1.21
#E4EAF7 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
17.41
#E4EAF7 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #E4EAF7
17.41:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##E4EAF7 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##E4EAF7 | 1.00 | 1.21 | 17.41 | 17.41 |
| #FFFFFF | 1.21 | 1.00 | 21.00 | 21.00 |
| #000000 | 17.41 | 21.00 | 1.00 | 1.00 |
| ##000000 | 17.41 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#E6EBF8
Deuteranopia (green-blind)
#E5E9F7
Tritanopia (blue-blind)
#E0ECEE
Achromatopsia (no color)
#EAEAEA
Design tokens & code
CSS
--color: #e4eaf7; /* rgb */ color: rgb(228, 234, 247); /* oklch */ color: oklch(93.6% 0.019 266.0);
Tailwind
colors: {
custom: {
50: '#ecf0f9',
500: '#e4eaf7',
950: '#000000',
},
}SCSS
$custom: #e4eaf7; $custom-light: #ecf0f9; $custom-dark: #000000;
JSON
{
"hex": "#e4eaf7",
"rgb": {
"r": 228,
"g": 234,
"b": 247
},
"hsl": {
"h": 221.053,
"s": 54.286,
"l": 93.137
},
"oklch": {
"l": 0.93632,
"c": 0.01872,
"h": 266
},
"luminance": 0.82055
}Semantic roles & 50–950 ramp
primary
#E4EAF7
secondary
#D8C8A8
accent
#9024C2
background
#FEFFFF
surface
#FDFEFF
border
#D5D6D7
text
#161617
muted
#848585