Farbkontrast-Prüfer
Überprüfen Sie das WCAG-Farbkontrastverhältnis zwischen Text- und Hintergrundfarben.
Vorschau großer Text
So sieht die Vorschau für normalen Text aus.
Über den Farbkontrast-Prüfer
Überprüfen Sie, ob Ihre Kombination aus Text- und Hintergrundfarbe die WCAG-2.1-Barrierefreiheitsanforderungen für Kontrast erfüllt. AA ist der empfohlene Mindeststandard; AAA ist der erweiterte Standard für bessere Lesbarkeit.
Was ist dieses Tool?
Überprüfen Sie, ob eine Kombination aus Vordergrund- (Text-) und Hintergrundfarbe die WCAG-2.1-Barrierefreiheitsstandards für Kontrast erfüllt. Erhalten Sie sofort ein Kontrastverhältnis sowie Bestanden/Nicht-bestanden-Ergebnisse für die Konformitätsstufen AA und AAA.
Anleitung
- Wählen oder geben Sie einen Hex-Wert für die Vordergrundfarbe (Text) ein.
- Wählen oder geben Sie einen Hex-Wert für die Hintergrundfarbe ein.
- Prüfen Sie die Live-Vorschau und die Bestanden/Nicht-bestanden-Ergebnisse für jede WCAG-Stufe.
Häufige Anwendungsfälle
- Überprüfen, ob die gewählten Text- und Hintergrundfarben die Barrierefreiheitsrichtlinien erfüllen, bevor ein Design veröffentlicht wird
- Auswählen gut lesbarer Farbkombinationen für Buttons, Links und Fließtext
- Prüfen einer bestehenden Website oder App auf Barrierefreiheits-Konformität
Tipps & Tricks
- AA (4,5:1) ist der Mindeststandard, den die meisten Websites für normalen Text erfüllen sollten.
- Großer Text (18pt+ oder 14pt+ fett) hat ein niedrigeres erforderliches Verhältnis, da er auch bei geringerem Kontrast leichter lesbar ist.
Überprüfen Sie das WCAG-Farbkontrastverhältnis zwischen Text- und Hintergrundfarben. Sofortige Prüfung der AA/AAA-Konformität, kostenlos und online.
kontrast prüfer · wcag kontrast · farbkontrast verhältnis · barrierefreiheit prüfen · online tool