Named color · #E8F7FD
Clear Skies
Clear Skies is #E8F7FD: rgb(232 247 253), hsl(197 84% 95%), oklch(0.967 0.018 223.6). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Clear Skies color name →
#E8F7FD
oklch(0.967 0.018 223.6)
Color conversions
- HEX
- #e8f7fd
- RGB
- rgb(232 247 253)
- HSL
- hsl(197 84% 95%)
- HWB
- hwb(197 91% 1%)
- OKLCH
- oklch(0.967 0.018 223.6)
- OKLab
- oklab(0.967 -0.013 -0.012)
- CIE Lab
- lab(96.24 -4.26 -4.68)
- LCH
- lch(96.24 6.33 227.7)
- CMYK
- cmyk(8% 2% 0% 1%)
Tints · Shades · Tones
Tints
- EAF8FD
- EDF9FD
- EFF9FE
- F1FAFE
- F4FBFE
- F6FCFE
- F8FDFE
- FAFDFF
- FDFEFF
Shades
- CAD7DC
- ACB7BC
- 90999D
- 747C7F
- 596062
- 404547
- 292C2D
- 131516
- 030303
Tones
- DDEAF0
- D2DEE3
- C8D2D6
- BDC6C9
- B3BABD
- A8AEB0
- 9EA2A4
- 949798
- 8A8B8C
Color harmonies
Complementary +180°
- E8F7FD
Clear Skies
- FFF1EB
≈ Strawberry Dust
Analogous -30° +30°
- E8F7FD
Clear Skies
- E7F8F7
≈ Melting Glacier
- EDF5FF
≈ Placebo Blue
Triadic +120° +240°
- E8F7FD
Clear Skies
- FDF0F7
≈ Lavender Blush
- F6F5E7
≈ White Mirage
Split-complementary +150° +210°
- E8F7FD
Clear Skies
- FFF0F1
≈ Sefid White
- FCF3E7
≈ White Fever
Tetradic +90° +180° +270°
- E8F7FD
Clear Skies
- F8F1FD
≈ Cloud Break
- FFF1EB
≈ Strawberry Dust
- EFF7EB
≈ Garden Dawn
Contrast & accessibility
Ag
FailOn white
WCAG 1.09:1 · APCA Lc 0
Ag
AAAOn black
WCAG 19.15:1 · APCA Lc 101
Best text color: #000000
WCAG 19.15:1 (AAA) · APCA Lc 101
Contrast pairs
Code snippets
CSS
:root {
--clear-skies: #e8f7fd;
--clear-skies-rgb: 232 247 253;
--clear-skies-oklch: oklch(0.967 0.018 223.6);
}
.element {
color: var(--clear-skies);
background-color: hsl(197 84% 95%);
border-color: oklch(0.967 0.018 223.6);
}Tailwind CSS v4
@theme {
--color-clear-skies: #e8f7fd;
--color-clear-skies-50: #f0f6f9;
--color-clear-skies-100: #e2e9ec;
--color-clear-skies-200: #cdd6da;
--color-clear-skies-300: #aeb9be;
--color-clear-skies-400: #94a1a6;
--color-clear-skies-500: #7a898f;
--color-clear-skies-600: #677479;
--color-clear-skies-700: #535d61;
--color-clear-skies-800: #3c4447;
--color-clear-skies-900: #292f31;
--color-clear-skies-950: #171b1d;
}SCSS
$clear-skies: #e8f7fd;
$clear-skies-rgb: 232, 247, 253;
$clear-skies-light: mix(#fff, $clear-skies, 20%);
$clear-skies-dark: mix(#000, $clear-skies, 20%);
.element {
color: $clear-skies;
box-shadow: 0 0 0 2px rgba($clear-skies, 0.35);
}