Benannte Farbe · #B1D3E3
Spotted Snake Eel
Spotted Snake Eel ist #B1D3E3: rgb(177 211 227), hsl(199 47% 79%), oklch(0.847 0.042 228). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Cyan mean? → · Spotted Snake Eel color name →
#B1D3E3
oklch(0.847 0.042 228)
Farbumrechnungen
- HEX
- #b1d3e3
- RGB
- rgb(177 211 227)
- HSL
- hsl(199 47% 79%)
- HWB
- hwb(199 69% 11%)
- OKLCH
- oklch(0.847 0.042 228)
- OKLab
- oklab(0.847 -0.028 -0.032)
- CIE Lab
- lab(82.45 -9.08 -11.88)
- LCH
- lch(82.45 14.95 232.6)
- CMYK
- cmyk(22% 7% 0% 11%)
Tints · Shades · Tones
Tints
- B9D7E6
- C1DCE9
- C8E0EB
- D0E5EE
- D8E9F1
- E0EDF4
- E8F2F7
- EFF6F9
- F7FBFC
Shades
- 99B7C5
- 839CA8
- 6C828C
- 576971
- 425157
- 2F3A3F
- 1C2427
- 0C1012
- 010203
Tones
- ACCAD9
- A7C2CE
- A2B9C4
- 9DB1BA
- 99A9B0
- 94A0A6
- 8F989D
- 8A9093
- 858889
Farbharmonien
Komplementär +180°
- B1D3E3
Spotted Snake Eel
- E5C5B5
≈ Cream Tan
Analog -30° +30°
- B1D3E3
Spotted Snake Eel
- ADD6D7
≈ Light Continental Waters
- BCCEE9
≈ Maritime
Triadisch +120° +240°
- B1D3E3
Spotted Snake Eel
- E3C2D2
≈ In the Slip
- CFCFB0
≈ Longbeard Grey
Geteilt komplementär +150° +210°
- B1D3E3
Spotted Snake Eel
- E8C2C2
≈ Baby’s Booties
- DCCAAE
≈ Cameo Role
Tetradisch +90° +180° +270°
- B1D3E3
Spotted Snake Eel
- D9C5DF
≈ Simply Lavender
- E5C5B5
≈ Cream Tan
- C0D4B9
≈ Surf Crest
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.57:1 · APCA Lc 26
Ag
AAAAuf Schwarz
WCAG 13.29:1 · APCA Lc 77
Beste Textfarbe: #000000
WCAG 13.29:1 (AAA) · APCA Lc 77
Contrast pairs
Code-Snippets
CSS
:root {
--spotted-snake-eel: #b1d3e3;
--spotted-snake-eel-rgb: 177 211 227;
--spotted-snake-eel-oklch: oklch(0.847 0.042 228);
}
.element {
color: var(--spotted-snake-eel);
background-color: hsl(199 47% 79%);
border-color: oklch(0.847 0.042 228);
}Tailwind CSS v4
@theme {
--color-spotted-snake-eel: #b1d3e3;
--color-spotted-snake-eel-50: #eaf8ff;
--color-spotted-snake-eel-100: #daebf4;
--color-spotted-snake-eel-200: #c3d8e3;
--color-spotted-snake-eel-300: #a2bcc9;
--color-spotted-snake-eel-400: #85a4b2;
--color-spotted-snake-eel-500: #698c9d;
--color-spotted-snake-eel-600: #597784;
--color-spotted-snake-eel-700: #475f6a;
--color-spotted-snake-eel-800: #33464e;
--color-spotted-snake-eel-900: #223036;
--color-spotted-snake-eel-950: #111c21;
}SCSS
$spotted-snake-eel: #b1d3e3;
$spotted-snake-eel-rgb: 177, 211, 227;
$spotted-snake-eel-light: mix(#fff, $spotted-snake-eel, 20%);
$spotted-snake-eel-dark: mix(#000, $spotted-snake-eel, 20%);
.element {
color: $spotted-snake-eel;
box-shadow: 0 0 0 2px rgba($spotted-snake-eel, 0.35);
}