Farb- & CSS-Tools — WCAG-Kontrast, modernes Einfügen
Farbwerkzeuge für Entwickler, die in Ihrem Browser laufen. Prüfen Sie den WCAG-2.2-Kontrast für ein Paar oder eine N×N-Matrix mit moderner CSS-Farbsyntax. Nichts wird hochgeladen. Wollen Sie Theme-CSS minifizieren? Siehe CSS minimieren und Verschönern CSS.
- Fügen Sie zwei Farben ein und lesen Sie die Ergebnisse für AA, AAA und Nicht-Text 3:1 ohne weiteren Schritt ab.
- Prüfen Sie eine Token-Palette in einer Matrix mit fixierter Kopfzeile und Konformitätsfilter.
- Teilen Sie eine URL, die Farben und Optionen wiederherstellt. Sie ist unabhängig von den Social-Buttons.
WCAG-Farbkontrast-Prüfer
WCAG-2.2-Kontrast für ein Paar oder eine Matrix. Fügen Sie OKLCH- und color()-Werte ein, blenden Sie optional die APCA-Beta ein und teilen Sie das Ergebnis per URL.
Farbkonverter
Fügen Sie eine CSS-Farbe ein und erhalten Sie HEX, RGB(A), HSL(A), HWB, LAB, LCH, OKLAB, OKLCH und color() zusammen. Alpha und Gamut werden berücksichtigt.
PX / REM / EM Umrechner
Eine px-, rem- oder em-Länge einfügen und alle drei Einheiten gleichzeitig sehen, plus eine Live-Referenztabelle gängiger px-Werte.
Farbabstufungen- & Farbtöne-Generator
Fügen Sie eine Farbe ein und erhalten Sie Skalen mit helleren und dunkleren Abstufungen Richtung Weiß und Schwarz. Die Stufenzahl ist einstellbar, die Ausgabe gibt es in HEX, RGB oder HSL.
CSS-Border-Radius-Generator
Fügen Sie ein CSS-border-radius ein, passen Sie die Ecken visuell an und kopieren Sie CSS oder Tailwind. Die elliptische Schreibweise mit Schrägstrich und eine teilbare URL werden unterstützt.
CSS Box-Shadow-Generator
Fügen Sie einen CSS-box-shadow ein, stapeln Sie Ebenen visuell und kopieren Sie CSS, Tailwind oder Bootstrap. Inset, mehrere Ebenen und eine teilbare URL werden unterstützt.
