Benannte Farbe · #19B6B5
Swagger
Swagger ist #19B6B5: rgb(25 182 181), hsl(180 76% 41%), oklch(0.704 0.117 194.1). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Teal mean? → · Swagger color name →
#19B6B5
oklch(0.704 0.117 194.1)
Farbumrechnungen
- HEX
- #19b6b5
- RGB
- rgb(25 182 181)
- HSL
- hsl(180 76% 41%)
- HWB
- hwb(180 10% 29%)
- OKLCH
- oklch(0.704 0.117 194.1)
- OKLab
- oklab(0.704 -0.113 -0.028)
- CIE Lab
- lab(66.94 -38.46 -10.84)
- LCH
- lch(66.94 39.96 195.7)
- CMYK
- cmyk(86% 0% 1% 29%)
Tints · Shades · Tones
Tints
- 46BEBC
- 61C5C4
- 79CCCB
- 8ED4D2
- A2DBDA
- B5E2E1
- C8EAE8
- DBF1F0
- EDF8F7
Shades
- 149E9D
- 108686
- 0B6F6F
- 075959
- 044444
- 023030
- 011D1D
- 000C0C
- 000202
Tones
- 35B1B0
- 46ABAA
- 52A6A5
- 5CA1A0
- 649B9A
- 6B9695
- 719190
- 778B8A
- 7C8685
Farbharmonien
Komplementär +180°
- 19B6B5
Swagger
- DE8089
≈ Pulp
Analog -30° +30°
- 19B6B5
Swagger
- 4DB68C
≈ Blue Green Scene
- 37AFD5
≈ Summer Air
Triadisch +120° +240°
- 19B6B5
Swagger
- BA89D2
≈ Pale Purple
- CB9444
≈ Bengal
Geteilt komplementär +150° +210°
- 19B6B5
Swagger
- D381B1
≈ Ice Plant
- DC8761
≈ Midnight in Saigon
Tetradisch +90° +180° +270°
- 19B6B5
Swagger
- 9795E6
≈ Perrywinkle
- DE8089
≈ Pulp
- ACA344
≈ Desert Locust
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 2.50:1 · APCA Lc 49
Ag
AAAAuf Schwarz
WCAG 8.39:1 · APCA Lc 53
Beste Textfarbe: #000000
WCAG 8.39:1 (AAA) · APCA Lc 53
Contrast pairs
Code-Snippets
CSS
:root {
--swagger: #19b6b5;
--swagger-rgb: 25 182 181;
--swagger-oklch: oklch(0.704 0.117 194.1);
}
.element {
color: var(--swagger);
background-color: hsl(180 76% 41%);
border-color: oklch(0.704 0.117 194.1);
}Tailwind CSS v4
@theme {
--color-swagger: #19b6b5;
--color-swagger-50: #cfffff;
--color-swagger-100: #bbf5f5;
--color-swagger-200: #97e4e5;
--color-swagger-300: #67cacb;
--color-swagger-400: #2ab4b3;
--color-swagger-500: #009d9d;
--color-swagger-600: #008585;
--color-swagger-700: #006a6a;
--color-swagger-800: #004f4d;
--color-swagger-900: #003735;
--color-swagger-950: #002121;
}SCSS
$swagger: #19b6b5;
$swagger-rgb: 25, 182, 181;
$swagger-light: mix(#fff, $swagger, 20%);
$swagger-dark: mix(#000, $swagger, 20%);
.element {
color: $swagger;
box-shadow: 0 0 0 2px rgba($swagger, 0.35);
}