Named color · #C5E8EE
Niagara Mist
Niagara Mist is #C5E8EE: rgb(197 232 238), hsl(189 55% 85%), oklch(0.908 0.037 209.1). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Cyan mean? → · Niagara Mist color name →
#C5E8EE
oklch(0.908 0.037 209.1)
Color conversions
- HEX
- #c5e8ee
- RGB
- rgb(197 232 238)
- HSL
- hsl(189 55% 85%)
- HWB
- hwb(189 77% 7%)
- OKLCH
- oklch(0.908 0.037 209.1)
- OKLab
- oklab(0.908 -0.033 -0.018)
- CIE Lab
- lab(89.61 -10.9 -6.95)
- LCH
- lch(89.61 12.92 212.5)
- CMYK
- cmyk(17% 3% 0% 7%)
Tints · Shades · Tones
Tints
- CBEAF0
- D1EDF1
- D7EFF3
- DCF1F5
- E2F4F7
- E8F6F8
- EEF8FA
- F4FAFC
- F9FDFD
Shades
- ABCACF
- 92ACB1
- 799093
- 617477
- 4B595C
- 354042
- 21292A
- 0E1314
- 020303
Tones
- BEDDE2
- B7D2D7
- B0C8CC
- A9BDC1
- A2B3B5
- 9BA8AB
- 949EA0
- 8E9495
- 878A8A
Color harmonies
Complementary +180°
- C5E8EE
Niagara Mist
- F9D8D2
≈ Bunny Ears
Analogous -30° +30°
- C5E8EE
Niagara Mist
- C7E9E1
≈ Clear Aqua
- CBE5F7
≈ Icy Landscape
Triadic +120° +240°
- C5E8EE
Niagara Mist
- EFD8ED
≈ Infatuation
- EAE0C5
≈ Sailcloth
Split-complementary +150° +210°
- C5E8EE
Niagara Mist
- F7D7E0
≈ Pink Frosting
- F4DBC9
≈ Mountain Fog
Tetradic +90° +180° +270°
- C5E8EE
Niagara Mist
- E4DCF7
≈ Contrail
- F9D8D2
≈ Bunny Ears
- DDE5C9
≈ Misty Hillside
Contrast & accessibility
Ag
FailOn white
WCAG 1.30:1 · APCA Lc 15
Ag
AAAOn black
WCAG 16.15:1 · APCA Lc 89
Best text color: #000000
WCAG 16.15:1 (AAA) · APCA Lc 89
Contrast pairs
Code snippets
CSS
:root {
--niagara-mist: #c5e8ee;
--niagara-mist-rgb: 197 232 238;
--niagara-mist-oklch: oklch(0.908 0.037 209.1);
}
.element {
color: var(--niagara-mist);
background-color: hsl(189 55% 85%);
border-color: oklch(0.908 0.037 209.1);
}Tailwind CSS v4
@theme {
--color-niagara-mist: #c5e8ee;
--color-niagara-mist-50: #eaf8fb;
--color-niagara-mist-100: #daecef;
--color-niagara-mist-200: #c3d9dd;
--color-niagara-mist-300: #a2bdc2;
--color-niagara-mist-400: #85a5aa;
--color-niagara-mist-500: #698d94;
--color-niagara-mist-600: #59787d;
--color-niagara-mist-700: #476064;
--color-niagara-mist-800: #334649;
--color-niagara-mist-900: #233133;
--color-niagara-mist-950: #121d1e;
}SCSS
$niagara-mist: #c5e8ee;
$niagara-mist-rgb: 197, 232, 238;
$niagara-mist-light: mix(#fff, $niagara-mist, 20%);
$niagara-mist-dark: mix(#000, $niagara-mist, 20%);
.element {
color: $niagara-mist;
box-shadow: 0 0 0 2px rgba($niagara-mist, 0.35);
}