WCAG-Kontrastprüfer: Aufgaben und Grenzen
Rechnet das Kontrastverhältnis Ihrer Text- und Hintergrundfarben aus und prüft gegen die WCAG-Grenzwerte für AA und AAA – mit Lesbarkeitsmuster direkt daneben.
Funktionen
Kontrastverhältnis auf zwei Nachkommastellen, AA und AAA für normalen und großen Text, 3:1-Prüfung für UI-Bestandteile, HEX-Eingabe und Farbwähler.
Anleitung
- Text- und Hintergrundfarbe wählen oder als HEX eintragen
- Verhältnis und Grenzwertprüfungen ablesen
- Mit dem Muster prüfen, wie sich der Text liest
- Bei Durchfall Farben anpassen, bis AA steht
Wann es sich lohnt
- Farbschemata vor dem Rollout prüfen
- Barrierefreiheits-Audits erfüllen
- Grautöne auf Karten und Buttons absichern
Häufige Fragen
Warum reicht reines Schwarz auf Weiß mit 21:1 locker?21:1 ist das theoretische Maximum. Schon mittlere Grautöne fallen darunter – 4,5:1 für normalen Text sind die AA-Untergrenze.
Was bedeutet AAA praktisch?AAA verlangt 7:1 für normalen Text und richtet sich an besonders lesbarkeitskritische Kontexte. AA ist die verbreitete Anforderung, etwa in EU-Richtlinien.
Zählt der Kontrast auch für Platzhaltertext in Formularen?Ja – auch Platzhalter sind Text. Sie müssen dieselben Grenzwerte erfüllen; sehr helle Grauplatzhalter sind ein klassischer Durchfaller.
Kann ich auch Linkfarben prüfen?Ja, jedes Paar aus Text- und Hintergrundfarbe lässt sich eingeben, auch für Links und Statusmeldungen. Für grafische Elemente gilt die 3:1-Grenze, die der Prüfer mit ausgibt.
Unterstützte Fälle
Groß meint ab 24 Pixeln normal oder 18,7 Pixeln fett. Ein bestandenes AA für großen Text gilt nicht automatisch für kleinen – der Prüfer listet beide getrennt, dazu die 3:1-Grenze für Schaltflächen und Formularfelder.
Weiterführende Werkzeuge
Diese Werkzeuge passen inhaltlich zu WCAG-Kontrastprüfer: