#E2F7FF#E2F7FF
#E2F7FF is a very light, muted cyan. Relative luminance 0.899; OKLCH L 96.3% C 0.025 H 222.6°. Best body text is #000000 at 18.98:1 contrast (WCAG AA passes).
Color values
| HEX | #E2F7FF |
|---|---|
| RGB | rgb(226, 247, 255) |
| HSL | hsl(197, 100%, 94%) |
| HSV | hsv(197, 11%, 100%) |
| CMYK | cmyk(11.4%, 3.1%, 0%, 0%) |
| CIE-LAB | lab(95.96, -5.30, -6.17) |
| CIE-LCH | lch(95.96, 8.13, 229.34°) |
| OKLab | oklab(96.31% -0.0181 -0.0166) |
| OKLCH | oklch(96.31% 0.025 222.6) |
| XYZ | xyz(82.6706, 89.9089, 107.5870) |
| Luminance | 0.8991 (WCAG relative) |
| Temperature | cool |
| Family | cyan |
Closest named colors
Azure (CSS)
#F0FFFF
ΔE00 4.12
Aliceblue
#F0F8FF
ΔE00 4.89
Lightcyan
#E0FFFF
ΔE00 5.63
Mintcream
#F5FFFA
ΔE00 6.80
Ice Blue (survey)
#D7FFFE
ΔE00 7.76
Very Light Blue
#D5FFFF
ΔE00 7.88
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#E2F7FF #FFEAE2
analogous
#E2FFF9 #E2F7FF #E2E9FF
triadic
#E2F7FF #FFE2F7 #F7FFE2
tetradic
#E2F7FF #F9E2FF #FFEAE2 #E9FFE2
square
#E2F7FF #F9E2FF #FFEAE2 #E9FFE2
split-complementary
#E2F7FF #FFE2E9 #FFF9E2
monochromatic
#68D5FF #A5E6FF #E0F7FF #E0F7FF #E0F7FF
Accessibility & contrast
On white
1.11
#E2F7FF on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
18.98
#E2F7FF on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #E2F7FF
18.98:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##E2F7FF | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##E2F7FF | 1.00 | 1.11 | 18.98 | 18.98 |
| #FFFFFF | 1.11 | 1.00 | 21.00 | 21.00 |
| #000000 | 18.98 | 21.00 | 1.00 | 1.00 |
| ##000000 | 18.98 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#F2F6FF
Deuteranopia (green-blind)
#EEF2FF
Tritanopia (blue-blind)
#DAFAF9
Achromatopsia (no color)
#F3F3F3
Design tokens & code
CSS
--color: #e2f7ff; /* rgb */ color: rgb(226, 247, 255); /* oklch */ color: oklch(96.3% 0.025 222.6);
Tailwind
colors: {
custom: {
50: '#ebf9ff',
500: '#e2f7ff',
950: '#000000',
},
}SCSS
$custom: #e2f7ff; $custom-light: #ebf9ff; $custom-dark: #000000;
JSON
{
"hex": "#e2f7ff",
"rgb": {
"r": 226,
"g": 247,
"b": 255
},
"hsl": {
"h": 196.552,
"s": 100,
"l": 94.314
},
"oklch": {
"l": 0.96312,
"c": 0.02456,
"h": 222.6
},
"luminance": 0.8991
}Semantic roles & 50–950 ramp
primary
#E2F7FF
secondary
#EDB098
accent
#3F00E6
background
#FEFFFF
surface
#FDFFFF
border
#D5D7D7
text
#161718
muted
#848586