Was ist das Kontrastverhältnis?

Es misst den Helligkeitsunterschied zweier Farben, von 1:1 (identisch) bis 21:1 (Schwarz auf Weiß). Je höher, desto leichter lesbar.

Was ist der Unterschied zwischen AA und AAA?

AA ist die Standard-Barrierefreiheitsstufe (4.5:1 für normalen Text); AAA ist strenger (7:1) für bessere Lesbarkeit.

Was gilt als großer Text?

Etwa 18 pt regulär oder 14 pt Fett und größer. Großer Text hat niedrigere Kontrastanforderungen (3:1 für AA).

Was ist die empfohlene Farbe?

Wenn Ihre Textfarbe AA nicht besteht, passt das Tool sie heller oder dunkler an, bis 4.5:1 gegenüber Ihrem Hintergrund erreicht ist, und bietet diese Farbe an.

Wird etwas hochgeladen?

Nein. Die Prüfung läuft vollständig in Ihrem Browser. Nichts wird an einen Server gesendet.

Farbkontrast-Prüfer

Textfarbe

Hintergrundfarbe

Großer Text als Beispiel

So sieht normaler Fließtext bei diesem Kontrast aus.

Kontrastverhältnis

4,48:1

AA · normaler Text✕

AAA · normaler Text✕

AA · großer Text✓

AAA · großer Text✕

Empfohlene Textfarbe:#717171

Prüfen Sie, ob Ihr Text auf seinem Hintergrund gut lesbar ist. Text- und Hintergrundfarbe eingeben, um das WCAG-Kontrastverhältnis und die AA- und AAA-Ergebnisse für normalen und großen Text mit Live-Vorschau zu sehen. Bei Nichtbestehen schlägt das Tool eine ähnliche Farbe vor, die besteht. Alles läuft in Ihrem Browser.

Anleitung

Textfarbe auswählen.
Hintergrundfarbe auswählen.
Kontrastverhältnis und AA / AAA-Ergebnisse ablesen.
Bei Nichtbestehen die vorgeschlagene Farbe übernehmen.

Was die WCAG-Stufen bedeuten

Das Kontrastverhältnis reicht von 1:1 (kein Kontrast) bis 21:1 (Schwarz auf Weiß). Für normalen Text verlangt AA mindestens 4.5:1 und AAA 7:1. Für großen Text verlangt AA 3:1 und AAA 4.5:1. Das Erreichen von mindestens AA hilft sehschwachen Personen, Inhalte bequem zu lesen.

Funktionen

Genaues Kontrastverhältnis

Das präzise WCAG-Verhältnis zwischen Ihren zwei Farben anzeigen.

AA- und AAA-Ergebnisse

Bestehen oder Nichtbestehen für normalen und großen Text auf einmal prüfen.

Live-Vorschau

Echten Text in Ihren Farben sehen, um die Lesbarkeit direkt beurteilen zu können.

Empfohlene bestandene Farbe

Bei zu niedrigem Kontrast eine nahe Farbe erhalten, die AA erfüllt.

Datenschutz by Design

Alles wird in Ihrem Browser berechnet. Nichts wird hochgeladen.

Typische Anwendungsfälle

Barrierefreie Benutzeroberfläche

Sicherstellen, dass Schnittstellentext die Anforderungen an die Barrierefreiheit erfüllt.

Markenfarben

Prüfen, ob Markenfarbkombinationen als Text gut lesbar sind.

Schaltflächen und Links

Überprüfen, ob Beschriftungen auf farbigen Schaltflächen und Links lesbar sind.

Dokumente und Präsentationen

Sicherstellen, dass Text auf farbigen Hintergründen genug hervortritt.

Hinweise und Tipps

Großer Text bedeutet etwa 18 pt oder 14 pt Fett und größer, was niedrigere Kontrastanforderungen hat.
Bedeutung nicht allein durch Farbe vermitteln; Text oder Symbole ergänzen.
Kontrast ist ein Faktor für Lesbarkeit, ebenso wie Schriftgröße und Abstände.
Alles läuft auf Ihrem Gerät — nichts wird an einen Server gesendet.

Häufig gestellte Fragen

Was ist das Kontrastverhältnis?: Es misst den Helligkeitsunterschied zweier Farben, von 1:1 (identisch) bis 21:1 (Schwarz auf Weiß). Je höher, desto leichter lesbar.
Was ist der Unterschied zwischen AA und AAA?: AA ist die Standard-Barrierefreiheitsstufe (4.5:1 für normalen Text); AAA ist strenger (7:1) für bessere Lesbarkeit.
Was gilt als großer Text?: Etwa 18 pt regulär oder 14 pt Fett und größer. Großer Text hat niedrigere Kontrastanforderungen (3:1 für AA).
Was ist die empfohlene Farbe?: Wenn Ihre Textfarbe AA nicht besteht, passt das Tool sie heller oder dunkler an, bis 4.5:1 gegenüber Ihrem Hintergrund erreicht ist, und bietet diese Farbe an.
Wird etwas hochgeladen?: Nein. Die Prüfung läuft vollständig in Ihrem Browser. Nichts wird an einen Server gesendet.