Benannte Farbe · #58BAC2
Sussie
Sussie ist #58BAC2: rgb(88 186 194), hsl(185 46% 55%), oklch(0.733 0.092 202.5). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Cyan mean? → · Sussie color name →
#58BAC2
oklch(0.733 0.092 202.5)
Farbumrechnungen
- HEX
- #58bac2
- RGB
- rgb(88 186 194)
- HSL
- hsl(185 46% 55%)
- HWB
- hwb(185 35% 24%)
- OKLCH
- oklch(0.733 0.092 202.5)
- OKLab
- oklab(0.733 -0.085 -0.035)
- CIE Lab
- lab(69.92 -28.26 -13.33)
- LCH
- lch(69.92 31.25 205.3)
- CMYK
- cmyk(55% 4% 0% 24%)
Tints · Shades · Tones
Tints
- 6CC1C8
- 7EC8CE
- 90CFD4
- A0D6DA
- B1DDE0
- C1E4E6
- D0EAED
- E0F1F3
- F0F8F9
Shades
- 4BA1A8
- 3F898F
- 337277
- 285C60
- 1D4649
- 123234
- 091E20
- 030D0E
- 000202
Tones
- 5FB4BB
- 65AEB5
- 6AA9AE
- 6FA3A7
- 739DA1
- 76979A
- 799193
- 7C8C8D
- 7E8686
Farbharmonien
Komplementär +180°
- 58BAC2
Sussie
- DD928E
≈ Coral Atoll
Analog -30° +30°
- 58BAC2
Sussie
- 66BCA3
≈ Mint Cold Green
- 69B3D9
≈ Skyscape
Triadisch +120° +240°
- 58BAC2
Sussie
- C595CB
≈ Amethyst Show
- C5A363
≈ Magic Lamp
Geteilt komplementär +150° +210°
- 58BAC2
Sussie
- D691AE
≈ Moonlit Mauve
- D79872
≈ Sweet Cardamom
Tetradisch +90° +180° +270°
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.27:1 · APCA Lc 45
Ag
AAAAuf Schwarz
WCAG 9.21:1 · APCA Lc 57
Beste Textfarbe: #000000
WCAG 9.21:1 (AAA) · APCA Lc 57
Contrast pairs
Code-Snippets
CSS
:root {
--sussie: #58bac2;
--sussie-rgb: 88 186 194;
--sussie-oklch: oklch(0.733 0.092 202.5);
}
.element {
color: var(--sussie);
background-color: hsl(185 46% 55%);
border-color: oklch(0.733 0.092 202.5);
}Tailwind CSS v4
@theme {
--color-sussie: #58bac2;
--color-sussie-50: #d8fdff;
--color-sussie-100: #c5f1f6;
--color-sussie-200: #a6e0e7;
--color-sussie-300: #7cc6cd;
--color-sussie-400: #53afb6;
--color-sussie-500: #1798a1;
--color-sussie-600: #198088;
--color-sussie-700: #15676d;
--color-sussie-800: #0c4c4f;
--color-sussie-900: #083537;
--color-sussie-950: #002022;
}SCSS
$sussie: #58bac2;
$sussie-rgb: 88, 186, 194;
$sussie-light: mix(#fff, $sussie, 20%);
$sussie-dark: mix(#000, $sussie, 20%);
.element {
color: $sussie;
box-shadow: 0 0 0 2px rgba($sussie, 0.35);
}