Benannte Farbe · #5511CC
Sea Serpent’s Tears
Sea Serpent’s Tears ist #5511CC: rgb(85 17 204), hsl(262 85% 43%), oklch(0.437 0.242 286.9). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Purple mean? → · Sea Serpent’s Tears color name →
#5511CC
oklch(0.437 0.242 286.9)
Farbumrechnungen
- HEX
- #5511cc
- RGB
- rgb(85 17 204)
- HSL
- hsl(262 85% 43%)
- HWB
- hwb(262 7% 20%)
- OKLCH
- oklch(0.437 0.242 286.9)
- OKLab
- oklab(0.437 0.07 -0.232)
- CIE Lab
- lab(29.62 58.52 -82.66)
- LCH
- lch(29.62 101.28 305.3)
- CMYK
- cmyk(58% 92% 0% 20%)
Tints · Shades · Tones
Tints
- 613BD3
- 6F56DA
- 7E6DE1
- 8E83E7
- 9F98EC
- B1ADF1
- C4C1F5
- D7D6F9
- EBEAFC
Shades
- 490DB1
- 3D0997
- 31067E
- 260465
- 1C024E
- 110137
- 080022
- 02000F
- 000002
Tones
- 572CC6
- 5A3BBF
- 5D48B8
- 6152B1
- 655BAA
- 6A64A2
- 6F6B9B
- 747392
- 7A7989
Farbharmonien
Komplementär +180°
- 5511CC
Sea Serpent’s Tears
- 585500
≈ Douro
Analog -30° +30°
- 5511CC
Sea Serpent’s Tears
- 004EA4
≈ Sea of Tears
- 7D009C
≈ Chinese Purple
Triadisch +120° +240°
- 5511CC
Sea Serpent’s Tears
- 853700
≈ Coffee Addiction
- 006147
≈ Sci-Fi Takeout
Geteilt komplementär +150° +210°
- 5511CC
Sea Serpent’s Tears
- 6E4A00
≈ Antique Bronze
- 296100
≈ Thuja Green
Tetradisch +90° +180° +270°
- 5511CC
Sea Serpent’s Tears
- 9B002D
≈ Lifeline
- 585500
≈ Douro
- 005E60
≈ Sandhill Crane
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 8.98:1 · APCA Lc 89
Ag
FailAuf Schwarz
WCAG 2.33:1 · APCA Lc 14
Beste Textfarbe: #FFFFFF
WCAG 8.98:1 (AAA) · APCA Lc 89
Contrast pairs
Code-Snippets
CSS
:root {
--sea-serpent-s-tears: #5511cc;
--sea-serpent-s-tears-rgb: 85 17 204;
--sea-serpent-s-tears-oklch: oklch(0.437 0.242 286.9);
}
.element {
color: var(--sea-serpent-s-tears);
background-color: hsl(262 85% 43%);
border-color: oklch(0.437 0.242 286.9);
}Tailwind CSS v4
@theme {
--color-sea-serpent-s-tears: #5511cc;
--color-sea-serpent-s-tears-50: #f2eaff;
--color-sea-serpent-s-tears-100: #e5dbff;
--color-sea-serpent-s-tears-200: #d1c2ff;
--color-sea-serpent-s-tears-300: #b69eff;
--color-sea-serpent-s-tears-400: #9a7dff;
--color-sea-serpent-s-tears-500: #8556ff;
--color-sea-serpent-s-tears-600: #704aed;
--color-sea-serpent-s-tears-700: #5a3cbf;
--color-sea-serpent-s-tears-800: #3f2b90;
--color-sea-serpent-s-tears-900: #2b1e66;
--color-sea-serpent-s-tears-950: #190b47;
}SCSS
$sea-serpent-s-tears: #5511cc;
$sea-serpent-s-tears-rgb: 85, 17, 204;
$sea-serpent-s-tears-light: mix(#fff, $sea-serpent-s-tears, 20%);
$sea-serpent-s-tears-dark: mix(#000, $sea-serpent-s-tears, 20%);
.element {
color: $sea-serpent-s-tears;
box-shadow: 0 0 0 2px rgba($sea-serpent-s-tears, 0.35);
}