Tiny Online Tools
Farbkontrast prüfen, bevor Farben live gehen
Eine Farbpalette kann gut aussehen und trotzdem an Barrierefreiheit scheitern. Mit diesem Prüfer lassen sich Vorder- und Hintergrundfarben gegen die WCAG-Kontrastgrenzen testen, bevor sie in ein Designsystem, eine Komponentenbibliothek oder ein Live-Produkt übernommen werden.
Was die Ergebnisse bedeuten
Das Tool zeigt das Kontrastverhältnis und ob die Kombination die üblichen WCAG-Stufen erfüllt für:
- normalen Text nach AA
- großen Text nach AA
- normalen Text nach AAA
- großen Text nach AAA
Warum das in echten Projekten wichtig ist
Kontrastprüfungen helfen besonders, wenn Sie:
- Markenfarben in Komponenten validieren
- Text auf Buttons, Karten oder Bannern testen
- Barrierefreiheit im Handoff prüfen
- schwer lesbare Kombinationen für Menschen mit Sehschwäche vermeiden möchten
Ein bestandener Test ist nicht das Ende
Eine Kombination kann formal bestehen und sich bei kleiner Schrift oder feiner Gewichtung trotzdem unangenehm lesen. Sehen Sie sich daher auch nach dem Bestehen noch die Vorschau mit realistischen Textgrößen an.