Named color · #94D0E9
Light Bright Spark
Light Bright Spark is #94D0E9: rgb(148 208 233), hsl(198 66% 75%), oklch(0.825 0.071 225.8). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Cyan mean? → · Light Bright Spark color name →
#94D0E9
oklch(0.825 0.071 225.8)
Color conversions
- HEX
- #94d0e9
- RGB
- rgb(148 208 233)
- HSL
- hsl(198 66% 75%)
- HWB
- hwb(198 58% 9%)
- OKLCH
- oklch(0.825 0.071 225.8)
- OKLab
- oklab(0.825 -0.049 -0.051)
- CIE Lab
- lab(80.04 -15.32 -18.87)
- LCH
- lch(80.04 24.31 230.9)
- CMYK
- cmyk(36% 11% 0% 9%)
Tints · Shades · Tones
Tints
- 9FD5EB
- AADAEE
- B5DEF0
- C0E3F2
- CAE8F4
- D5ECF7
- E0F1F9
- EAF6FB
- F5FAFD
Shades
- 80B5CB
- 6D9AAD
- 5A8090
- 486774
- 364F5A
- 263941
- 162329
- 081013
- 010203
Tones
- 93C8DE
- 91C0D3
- 8FB7C9
- 8EAFBE
- 8CA7B3
- 8A9FA9
- 87979F
- 859094
- 83888A
Color harmonies
Complementary +180°
- 94D0E9
Light Bright Spark
- EEB8A0
≈ Antique Cameo
Analogous -30° +30°
- 94D0E9
Light Bright Spark
- 8ED5D5
≈ Summer Soft Blue
- A8C8F4
≈ Baby Blue Eyes
Triadic +120° +240°
- 94D0E9
Light Bright Spark
- E9B4D0
≈ Sweet Lilac
- CBC994
≈ Creamy Spinaci
Split-complementary +150° +210°
- 94D0E9
Light Bright Spark
- F0B4B6
≈ Jaguar Rose
- E1C093
≈ Dromedary
Tetradic +90° +180° +270°
- 94D0E9
Light Bright Spark
- D8B8E5
≈ Pretty Petunia
- EEB8A0
≈ Antique Cameo
- B2D1A3
≈ Apium
Contrast & accessibility
Ag
FailOn white
WCAG 1.68:1 · APCA Lc 30
Ag
AAAOn black
WCAG 12.45:1 · APCA Lc 73
Best text color: #000000
WCAG 12.45:1 (AAA) · APCA Lc 73
Contrast pairs
Code snippets
CSS
:root {
--light-bright-spark: #94d0e9;
--light-bright-spark-rgb: 148 208 233;
--light-bright-spark-oklch: oklch(0.825 0.071 225.8);
}
.element {
color: var(--light-bright-spark);
background-color: hsl(198 66% 75%);
border-color: oklch(0.825 0.071 225.8);
}Tailwind CSS v4
@theme {
--color-light-bright-spark: #94d0e9;
--color-light-bright-spark-50: #e1faff;
--color-light-bright-spark-100: #d0edfb;
--color-light-bright-spark-200: #b6dbec;
--color-light-bright-spark-300: #92bfd4;
--color-light-bright-spark-400: #70a8be;
--color-light-bright-spark-500: #4e90aa;
--color-light-bright-spark-600: #437a90;
--color-light-bright-spark-700: #356273;
--color-light-bright-spark-800: #254854;
--color-light-bright-spark-900: #19323b;
--color-light-bright-spark-950: #091e25;
}SCSS
$light-bright-spark: #94d0e9;
$light-bright-spark-rgb: 148, 208, 233;
$light-bright-spark-light: mix(#fff, $light-bright-spark, 20%);
$light-bright-spark-dark: mix(#000, $light-bright-spark, 20%);
.element {
color: $light-bright-spark;
box-shadow: 0 0 0 2px rgba($light-bright-spark, 0.35);
}