Tools · Farbe · Farbkontrast prüfen

Farbkontrast prüfen

Prüfe, ob zwei Farben die WCAG-Kontrastanforderungen für Text und Bedienoberfläche erfüllen.

Datei hier ablegen oder auswählen.

Läuft komplett im Browser. Es wird nichts hochgeladen.

So funktioniert es

  1. Eine Textfarbe und eine Hintergrundfarbe wählen oder eingeben.

  2. Das Kontrastverhältnis ablesen und sehen, ob es AA und AAA besteht.

  3. Eine der beiden Farben anpassen, bis sie die gewünschte Stufe besteht.

Häufige Fragen

4,5:1 für normalen Text, und 3:1 für großen Text (18pt, oder 14pt fett) sowie für UI-Komponenten und bedeutungstragende Grafiken.

Text braucht 7:1 und großer Text 4,5:1 - eine strengere Stufe, für die meisten Websites nicht vorgeschrieben, aber sinnvoll, wo sie leicht erreichbar ist.

18pt (24px) normal, oder 14pt (19px) fett, nach der eigenen Definition von WCAG.

Ja, es prüft auch den 3:1-Schwellenwert für UI-Komponenten (wie Button-Rahmen und Formularfelder) und bedeutungstragende Grafiken, nach der Nicht-Text-Kontrastregel von WCAG 2.1.

Nein. Das Verhältnis wird vollständig in deinem Browser berechnet.

Kommentare

  1. Noch keine Kommentare. Teile deine Erfahrung als Erstes.
Deine Bewertung (optional)

Keine Bewertung ausgewählt