Named color · #99D0E7
Light Whimsy
Light Whimsy is #99D0E7: rgb(153 208 231), hsl(198 62% 75%), oklch(0.827 0.065 225.7). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Cyan mean? → · Light Whimsy color name →
#99D0E7
oklch(0.827 0.065 225.7)
Color conversions
- HEX
- #99d0e7
- RGB
- rgb(153 208 231)
- HSL
- hsl(198 62% 75%)
- HWB
- hwb(198 60% 9%)
- OKLCH
- oklch(0.827 0.065 225.7)
- OKLab
- oklab(0.827 -0.046 -0.047)
- CIE Lab
- lab(80.26 -14.27 -17.44)
- LCH
- lch(80.26 22.53 230.7)
- CMYK
- cmyk(34% 10% 0% 9%)
Tints · Shades · Tones
Tints
- A4D5EA
- AED9EC
- B8DEEE
- C3E3F1
- CDE8F3
- D7ECF6
- E1F1F8
- EBF6FA
- F5FAFD
Shades
- 84B5C9
- 709AAB
- 5D808F
- 4A6773
- 384F59
- 273940
- 172328
- 081013
- 010203
Tones
- 97C8DC
- 95C0D2
- 93B7C7
- 90AFBD
- 8EA7B2
- 8B9FA8
- 89979E
- 869094
- 83888A
Color harmonies
Complementary +180°
- 99D0E7
Light Whimsy
- EBBAA4
≈ Sunset Drive
Analogous -30° +30°
- 99D0E7
Light Whimsy
- 94D4D4
≈ Summer Soft Blue
- ABC9F1
≈ Tropical Blue
Triadic +120° +240°
- 99D0E7
Light Whimsy
- E7B6D0
≈ Sweet Lilac
- CCCA99
≈ Tidal Green
Split-complementary +150° +210°
- 99D0E7
Light Whimsy
- EEB6B8
≈ Camille Pink
- DFC197
≈ Dapper Dingo
Tetradic +90° +180° +270°
- 99D0E7
Light Whimsy
- D7BAE4
≈ Pretty Petunia
- EBBAA4
≈ Sunset Drive
- B4D1A7
≈ Apium
Contrast & accessibility
Ag
FailOn white
WCAG 1.67:1 · APCA Lc 30
Ag
AAAOn black
WCAG 12.53:1 · APCA Lc 73
Best text color: #000000
WCAG 12.53:1 (AAA) · APCA Lc 73
Contrast pairs
Code snippets
CSS
:root {
--light-whimsy: #99d0e7;
--light-whimsy-rgb: 153 208 231;
--light-whimsy-oklch: oklch(0.827 0.065 225.7);
}
.element {
color: var(--light-whimsy);
background-color: hsl(198 62% 75%);
border-color: oklch(0.827 0.065 225.7);
}Tailwind CSS v4
@theme {
--color-light-whimsy: #99d0e7;
--color-light-whimsy-50: #e3f9ff;
--color-light-whimsy-100: #d2edf9;
--color-light-whimsy-200: #b8daea;
--color-light-whimsy-300: #95bfd2;
--color-light-whimsy-400: #74a7bc;
--color-light-whimsy-500: #548fa7;
--color-light-whimsy-600: #48798d;
--color-light-whimsy-700: #396171;
--color-light-whimsy-800: #284753;
--color-light-whimsy-900: #1b313a;
--color-light-whimsy-950: #0b1d24;
}SCSS
$light-whimsy: #99d0e7;
$light-whimsy-rgb: 153, 208, 231;
$light-whimsy-light: mix(#fff, $light-whimsy, 20%);
$light-whimsy-dark: mix(#000, $light-whimsy, 20%);
.element {
color: $light-whimsy;
box-shadow: 0 0 0 2px rgba($light-whimsy, 0.35);
}