Nearest named color · #E1F3EA
#E1F3EA
Nearest named color: Shattered Ice
#E1F3EA (rgb(225 243 234), hsl(150 43% 92%), oklch(0.948 0.022 164.5)) is closest to the named color Shattered Ice. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#E1F3EA
oklch(0.948 0.022 164.5)
Color conversions
- HEX
- #e1f3ea
- RGB
- rgb(225 243 234)
- HSL
- hsl(150 43% 92%)
- HWB
- hwb(150 88% 5%)
- OKLCH
- oklch(0.948 0.022 164.5)
- OKLab
- oklab(0.948 -0.022 0.006)
- CIE Lab
- lab(94.31 -7.37 2.21)
- LCH
- lch(94.31 7.7 163.3)
- CMYK
- cmyk(7% 0% 4% 5%)
Tints · Shades · Tones
Tints
- E4F4EC
- E7F5EE
- EAF7F0
- EDF8F2
- F0F9F4
- F3FAF7
- F6FBF9
- F9FDFB
- FCFEFD
Shades
- C4D3CB
- A7B4AE
- 8B9791
- 707A75
- 565E5A
- 3E4441
- 272B29
- 121413
- 020303
Tones
- D7E7DF
- CDDBD4
- C3CFC9
- B9C3BE
- AFB8B4
- A6ACA9
- 9CA19F
- 939694
- 898B8A
Color harmonies
Complementary +180°
- E1F3EA
Shattered Ice
- FAE8F1
≈ Cherry Pearl
Analogous -30° +30°
- E1F3EA
Shattered Ice
- E8F2E3
≈ Dinner Mint
- DEF3F2
≈ Bone-Chilling
Triadic +120° +240°
- E1F3EA
Shattered Ice
- ECECFD
≈ Placebo Purple
- FCEAE2
≈ Dogwood
Split-complementary +150° +210°
- E1F3EA
Shattered Ice
- F4EAF9
≈ Perfume Haze
- FDE8E9
≈ Pink Sparkle
Tetradic +90° +180° +270°
- E1F3EA
Shattered Ice
- E4EFFD
≈ Cotton Boll
- FAE8F1
≈ Cherry Pearl
- F7ECDE
≈ A la Mode
Contrast & accessibility
Ag
FailOn white
WCAG 1.15:1 · APCA Lc 0
Ag
AAAOn black
WCAG 18.20:1 · APCA Lc 97
Best text color: #000000
WCAG 18.20:1 (AAA) · APCA Lc 97
Contrast pairs
Code snippets
CSS
:root {
--shattered-ice: #e1f3ea;
--shattered-ice-rgb: 225 243 234;
--shattered-ice-oklch: oklch(0.948 0.022 164.5);
}
.element {
color: var(--shattered-ice);
background-color: hsl(150 43% 92%);
border-color: oklch(0.948 0.022 164.5);
}Tailwind CSS v4
@theme {
--color-shattered-ice: #e1f3ea;
--color-shattered-ice-50: #eff7f4;
--color-shattered-ice-100: #e1eae6;
--color-shattered-ice-200: #ccd7d2;
--color-shattered-ice-300: #adbbb5;
--color-shattered-ice-400: #93a39b;
--color-shattered-ice-500: #798b82;
--color-shattered-ice-600: #67766e;
--color-shattered-ice-700: #525e58;
--color-shattered-ice-800: #3c4540;
--color-shattered-ice-900: #29302c;
--color-shattered-ice-950: #171c19;
}SCSS
$shattered-ice: #e1f3ea;
$shattered-ice-rgb: 225, 243, 234;
$shattered-ice-light: mix(#fff, $shattered-ice, 20%);
$shattered-ice-dark: mix(#000, $shattered-ice, 20%);
.element {
color: $shattered-ice;
box-shadow: 0 0 0 2px rgba($shattered-ice, 0.35);
}