#F2F7FE#F2F7FE
#F2F7FE is a very light, near-neutral blue. Relative luminance 0.926; OKLCH L 97.4% C 0.011 H 256.7°. Best body text is #000000 at 19.51:1 contrast (WCAG AA passes).
Color values
| HEX | #F2F7FE |
|---|---|
| RGB | rgb(242, 247, 254) |
| HSL | hsl(215, 86%, 97%) |
| HSV | hsv(215, 5%, 100%) |
| CMYK | cmyk(4.7%, 2.8%, 0%, 0.4%) |
| CIE-LAB | lab(97.05, -0.38, -3.93) |
| CIE-LCH | lch(97.05, 3.94, 264.48°) |
| OKLab | oklab(97.44% -0.0025 -0.0105) |
| OKLCH | oklch(97.44% 0.011 256.7) |
| XYZ | xyz(87.7647, 92.5541, 106.9877) |
| Luminance | 0.9255 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Closest named colors
Aliceblue
#F0F8FF
ΔE00 1.35
Ghostwhite
#F8F8FF
ΔE00 2.48
Pale Grey
#FDFDFE
ΔE00 3.50
Whitesmoke
#F5F5F5
ΔE00 3.65
White
#FFFFFF
ΔE00 4.02
Off White
#FAF9F6
ΔE00 5.23
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#F2F7FE #FEF9F2
analogous
#F2FDFE #F2F7FE #F3F2FE
triadic
#F2F7FE #FEF2F7 #F7FEF2
tetradic
#F2F7FE #FEF2FD #FEF9F2 #F2FEF3
square
#F2F7FE #FEF2FD #FEF9F2 #F2FEF3
split-complementary
#F2F7FE #FEF3F2 #FDFEF2
monochromatic
#80B1F5 #B9D4FA #E3EEFD #E3EEFD #E3EEFD
Accessibility & contrast
On white
1.08
#F2F7FE on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
19.51
#F2F7FE on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #F2F7FE
19.51:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##F2F7FE | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##F2F7FE | 1.00 | 1.08 | 19.51 | 19.51 |
| #FFFFFF | 1.08 | 1.00 | 21.00 | 21.00 |
| #000000 | 19.51 | 21.00 | 1.00 | 1.00 |
| ##000000 | 19.51 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#F5F7FE
Deuteranopia (green-blind)
#F4F6FE
Tritanopia (blue-blind)
#EFF8F9
Achromatopsia (no color)
#F6F6F6
Design tokens & code
CSS
--color: #f2f7fe; /* rgb */ color: rgb(242, 247, 254); /* oklch */ color: oklch(97.4% 0.011 256.7);
Tailwind
colors: {
custom: {
50: '#f6f9fe',
500: '#f2f7fe',
950: '#000000',
},
}SCSS
$custom: #f2f7fe; $custom-light: #f6f9fe; $custom-dark: #000000;
JSON
{
"hex": "#f2f7fe",
"rgb": {
"r": 242,
"g": 247,
"b": 254
},
"hsl": {
"h": 215,
"s": 85.714,
"l": 97.255
},
"oklch": {
"l": 0.97437,
"c": 0.01077,
"h": 256.7
},
"luminance": 0.92555
}Semantic roles & 50–950 ramp
primary
#F2F7FE
secondary
#EACFAA
accent
#8503E2
background
#FFFFFF
surface
#FEFFFF
border
#D6D7D7
text
#171717
muted
#858585