Named color · #95CCE4
Medical Mask
Medical Mask is #95CCE4: rgb(149 204 228), hsl(198 59% 74%), oklch(0.815 0.066 226.8). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Cyan mean? → · Medical Mask color name →
#95CCE4
oklch(0.815 0.066 226.8)
Color conversions
- HEX
- #95cce4
- RGB
- rgb(149 204 228)
- HSL
- hsl(198 59% 74%)
- HWB
- hwb(198 58% 11%)
- OKLCH
- oklch(0.815 0.066 226.8)
- OKLab
- oklab(0.815 -0.045 -0.048)
- CIE Lab
- lab(78.86 -14.08 -17.97)
- LCH
- lch(78.86 22.83 231.9)
- CMYK
- cmyk(35% 11% 0% 11%)
Tints · Shades · Tones
Tints
- A0D1E7
- ABD6EA
- B5DBEC
- C0E0EF
- CBE6F2
- D5EBF4
- E0F0F7
- EAF5FA
- F5FAFC
Shades
- 81B1C6
- 6D97A9
- 5A7E8D
- 486572
- 374E58
- 26373F
- 162228
- 080F12
- 010203
Tones
- 93C4DA
- 92BCCF
- 90B5C5
- 8EADBB
- 8CA5B1
- 8A9EA7
- 87969D
- 858F93
- 83878A
Color harmonies
Complementary +180°
- 95CCE4
Medical Mask
- E8B69F
≈ Black-Eyed Peach
Analogous -30° +30°
- 95CCE4
Medical Mask
- 8FD0D1
≈ Fling Green
- A8C5EE
≈ Sky High
Triadic +120° +240°
- 95CCE4
Medical Mask
- E4B2CB
≈ Muddy Mauve
- C7C695
≈ Paris Mint
Split-complementary +150° +210°
- 95CCE4
Medical Mask
- EAB2B3
≈ Strawberry Yoghurt
- DBBE93
≈ Blonde
Tetradic +90° +180° +270°
- 95CCE4
Medical Mask
- D4B6E0
≈ Pretty Petunia
- E8B69F
≈ Black-Eyed Peach
- AFCDA3
≈ Garden Room
Contrast & accessibility
Ag
FailOn white
WCAG 1.74:1 · APCA Lc 32
Ag
AAAOn black
WCAG 12.03:1 · APCA Lc 71
Best text color: #000000
WCAG 12.03:1 (AAA) · APCA Lc 71
Contrast pairs
Code snippets
CSS
:root {
--medical-mask: #95cce4;
--medical-mask-rgb: 149 204 228;
--medical-mask-oklch: oklch(0.815 0.066 226.8);
}
.element {
color: var(--medical-mask);
background-color: hsl(198 59% 74%);
border-color: oklch(0.815 0.066 226.8);
}Tailwind CSS v4
@theme {
--color-medical-mask: #95cce4;
--color-medical-mask-50: #e3f9ff;
--color-medical-mask-100: #d2edfa;
--color-medical-mask-200: #b8daeb;
--color-medical-mask-300: #95bfd3;
--color-medical-mask-400: #74a7bd;
--color-medical-mask-500: #538fa8;
--color-medical-mask-600: #47798e;
--color-medical-mask-700: #396172;
--color-medical-mask-800: #284754;
--color-medical-mask-900: #1a313a;
--color-medical-mask-950: #0b1d24;
}SCSS
$medical-mask: #95cce4;
$medical-mask-rgb: 149, 204, 228;
$medical-mask-light: mix(#fff, $medical-mask, 20%);
$medical-mask-dark: mix(#000, $medical-mask, 20%);
.element {
color: $medical-mask;
box-shadow: 0 0 0 2px rgba($medical-mask, 0.35);
}