Named color · #88EEFF
Photon Projector
Photon Projector is #88EEFF: rgb(136 238 255), hsl(189 100% 77%), oklch(0.893 0.098 209.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Cyan mean? → · Photon Projector color name →
#88EEFF
oklch(0.893 0.098 209.4)
Color conversions
- HEX
- #88eeff
- RGB
- rgb(136 238 255)
- HSL
- hsl(189 100% 77%)
- HWB
- hwb(189 53% 0%)
- OKLCH
- oklch(0.893 0.098 209.4)
- OKLab
- oklab(0.893 -0.085 -0.048)
- CIE Lab
- lab(88.37 -27.86 -18.05)
- LCH
- lch(88.37 33.2 212.9)
- CMYK
- cmyk(47% 7% 0% 0%)
Tints · Shades · Tones
Tints
- 96F0FF
- A4F2FF
- B0F4FF
- BDF5FF
- C8F7FF
- D4F9FF
- DFFAFF
- EAFCFF
- F4FEFF
Shades
- 75CFDE
- 63B1BE
- 52939E
- 417780
- 315C63
- 224248
- 132A2E
- 061416
- 010303
Tones
- 89E3F2
- 8AD7E4
- 8ACCD7
- 8AC1CB
- 89B6BE
- 88ABB1
- 86A0A5
- 859598
- 828B8C
Color harmonies
Complementary +180°
- 88EEFF
Photon Projector
- FFCFC6
≈ Snow Pa
Analogous -30° +30°
- 88EEFF
Photon Projector
- 8FF1DD
≈ Turquoise Pearl
- B9E2FF
≈ Dithered Sky
Triadic +120° +240°
- 88EEFF
Photon Projector
- FFC6FA
≈ Sugar Chic
- F6D98F
≈ Meadow Yellow
Split-complementary +150° +210°
- 88EEFF
Photon Projector
- FFCCDA
≈ Linnet Egg Red
- FFD2AF
≈ Papaya Whip
Tetradic +90° +180° +270°
- 88EEFF
Photon Projector
- E1D4FF
≈ Pale Lavender
- FFCFC6
≈ Snow Pa
- D4E69B
≈ Apple Bob
Contrast & accessibility
Ag
FailOn white
WCAG 1.33:1 · APCA Lc 16
Ag
AAAOn black
WCAG 15.72:1 · APCA Lc 87
Best text color: #000000
WCAG 15.72:1 (AAA) · APCA Lc 87
Contrast pairs
Code snippets
CSS
:root {
--photon-projector: #88eeff;
--photon-projector-rgb: 136 238 255;
--photon-projector-oklch: oklch(0.893 0.098 209.4);
}
.element {
color: var(--photon-projector);
background-color: hsl(189 100% 77%);
border-color: oklch(0.893 0.098 209.4);
}Tailwind CSS v4
@theme {
--color-photon-projector: #88eeff;
--color-photon-projector-50: #d6fdff;
--color-photon-projector-100: #c3f1fb;
--color-photon-projector-200: #a3e0ec;
--color-photon-projector-300: #79c5d4;
--color-photon-projector-400: #4daebe;
--color-photon-projector-500: #0097a9;
--color-photon-projector-600: #09808f;
--color-photon-projector-700: #0a6773;
--color-photon-projector-800: #044c54;
--color-photon-projector-900: #04353a;
--color-photon-projector-950: #002024;
}SCSS
$photon-projector: #88eeff;
$photon-projector-rgb: 136, 238, 255;
$photon-projector-light: mix(#fff, $photon-projector, 20%);
$photon-projector-dark: mix(#000, $photon-projector, 20%);
.element {
color: $photon-projector;
box-shadow: 0 0 0 2px rgba($photon-projector, 0.35);
}