Farbkontrast-Prüfer
Geben Sie Text- und Hintergrundfarbe ein und sehen Sie sofort das WCAG-2.2-Verhältnis und das AA/AAA-Ergebnis.
Dieses Werkzeug berechnet das Kontrastverhältnis zwischen einer von Ihnen gewählten Text- und Hintergrundfarbe nach der WCAG-2.2-Formel für relative Leuchtdichte. Sie können eine Farbe über den Farbwähler oder als HEX, RGB oder HSL eingeben, auch verkürztes HEX wird unterstützt. Das Ergebnis erscheint zusammen mit einer Live-Vorschau von Text, Schaltfläche und Link in echter Größe, sodass Sie nicht nur eine Zahl, sondern auch den Eindruck beurteilen können. Bei einer transparenten (Alpha-)Farbe wird sie vor der Berechnung mit dem gewählten Hintergrund vermischt.
Das Ergebnis wird an vier Schwellenwerten geprüft: AA 4,5:1 und AAA 7:1 für normalen Text, AA 3:1 und AAA 4,5:1 für großen Text sowie 3:1 für Bedienelemente und Grafiken. Reicht das Verhältnis nicht aus, schlägt das Werkzeug den nächstgelegenen bestehenden Farbton bei gleichbleibendem Farbton vor, dieser Vorschlag lässt sich mit einem Klick übernehmen. Im Palettenmodus können Sie 2 bis 6 Farben eingeben und das Verhältnis aller Paare in einer Tabelle sehen.
Diese Prüfung berechnet nur das numerische Kontrastverhältnis, sie berücksichtigt keine anderen Faktoren für die Lesbarkeit wie Schriftart, Laufweite oder visuelle Unruhe um den Text, und sie scannt keine echte Seite für Sie. Unterschiedliche Arten von Farbenblindheit nehmen dasselbe Verhältnis unterschiedlich wahr, ein bestandenes Verhältnis garantiert also keine angenehme Lesbarkeit für alle. Eine gründliche Barrierefreiheitsprüfung erfordert auch Tests mit echten Nutzern oder einem Screenreader.
Häufige Fragen
Wie groß muss Text sein, um als groß zu gelten?
Nach WCAG gilt Text ab etwa 18 pt (24 px) normal oder 14 pt (18,5 px) fett als groß; alles Kleinere muss die strengeren Schwellenwerte für normalen Text erfüllen.
Soll ich AA oder AAA anstreben?
AA ist der auf den meisten Websites erwartete Grundstandard; AAA ist strenger und empfehlenswert, wenn Barrierefreiheit Priorität hat, lässt sich aber schwerer mit Markenfarben erreichen.
Ist mein Design vollständig barrierefrei, wenn das Verhältnis besteht?
Nein, das Kontrastverhältnis ist nur ein Faktor, auch Schriftart, Schriftstärke, Laufweite und Umgebung beeinflussen die Lesbarkeit, ein bestandenes Verhältnis ersetzt also keine umfassendere Barrierefreiheitsprüfung.
Werden die eingegebenen Farben irgendwo gespeichert?
Nein, alles wird vollständig in Ihrem Browser berechnet, keine Farbe und keine Palette verlässt Ihr Gerät.
