Named color · #C3E3EB
Serene Sky
Serene Sky is #C3E3EB: rgb(195 227 235), hsl(192 50% 84%), oklch(0.895 0.035 214.5). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Cyan mean? → · Serene Sky color name →
#C3E3EB
oklch(0.895 0.035 214.5)
Color conversions
- HEX
- #c3e3eb
- RGB
- rgb(195 227 235)
- HSL
- hsl(192 50% 84%)
- HWB
- hwb(192 76% 8%)
- OKLCH
- oklch(0.895 0.035 214.5)
- OKLab
- oklab(0.895 -0.029 -0.02)
- CIE Lab
- lab(88.09 -9.65 -7.63)
- LCH
- lch(88.09 12.3 218.3)
- CMYK
- cmyk(17% 3% 0% 8%)
Tints · Shades · Tones
Tints
- C9E6ED
- CFE9EF
- D5EBF1
- DBEEF3
- E1F1F5
- E7F4F7
- EDF7F9
- F3F9FB
- F9FCFD
Shades
- A9C5CC
- 90A8AE
- 788C91
- 607175
- 4A575B
- 343F41
- 202729
- 0E1213
- 020303
Tones
- BCD9E0
- B5CED5
- AFC4CA
- A8BABF
- A1B0B4
- 9BA6A9
- 949D9F
- 8D9394
- 87898A
Color harmonies
Complementary +180°
- C3E3EB
Serene Sky
- F3D5CD
≈ Creole Pink
Analogous -30° +30°
- C3E3EB
Serene Sky
- C4E5DF
≈ Windwood Spring
- CAE0F3
≈ First Shade of Blue
Triadic +120° +240°
- C3E3EB
Serene Sky
- ECD4E6
≈ Champagne Elegance
- E4DDC3
≈ Bamboo
Split-complementary +150° +210°
- C3E3EB
Serene Sky
- F2D3D9
≈ Cradle Pillow
- EED8C5
≈ Canadian Pancake
Tetradic +90° +180° +270°
- C3E3EB
Serene Sky
- E1D7F0
≈ Japan Blush
- F3D5CD
≈ Creole Pink
- D7E1C8
≈ Lacewing
Contrast & accessibility
Ag
FailOn white
WCAG 1.35:1 · APCA Lc 17
Ag
AAAOn black
WCAG 15.50:1 · APCA Lc 86
Best text color: #000000
WCAG 15.50:1 (AAA) · APCA Lc 86
Contrast pairs
Code snippets
CSS
:root {
--serene-sky: #c3e3eb;
--serene-sky-rgb: 195 227 235;
--serene-sky-oklch: oklch(0.895 0.035 214.5);
}
.element {
color: var(--serene-sky);
background-color: hsl(192 50% 84%);
border-color: oklch(0.895 0.035 214.5);
}Tailwind CSS v4
@theme {
--color-serene-sky: #c3e3eb;
--color-serene-sky-50: #ebf8fc;
--color-serene-sky-100: #dbebf0;
--color-serene-sky-200: #c4d8de;
--color-serene-sky-300: #a4bcc3;
--color-serene-sky-400: #87a4ab;
--color-serene-sky-500: #6c8d95;
--color-serene-sky-600: #5b777e;
--color-serene-sky-700: #495f65;
--color-serene-sky-800: #34464a;
--color-serene-sky-900: #243033;
--color-serene-sky-950: #121d1f;
}SCSS
$serene-sky: #c3e3eb;
$serene-sky-rgb: 195, 227, 235;
$serene-sky-light: mix(#fff, $serene-sky, 20%);
$serene-sky-dark: mix(#000, $serene-sky, 20%);
.element {
color: $serene-sky;
box-shadow: 0 0 0 2px rgba($serene-sky, 0.35);
}