Farbkontrast-Prüfer - WCAG-Barrierefreiheits-Kontrastverhältnis-Tool

Überprüfen Sie WCAG-Farbkontrastverhältnisse für die AA- und AAA-Barrierefreiheitskonformität

Farbwerkzeuge

Tool

Foreground (Text)

Background

Sample Normal Text — The quick brown fox

Large Text Preview (24px Bold)

Small body text for readability testing purposes.

Contrast Ratio

14.63:1

Normal Text

✓ AA (4.5:1)✓ AAA (7:1)

Large Text (18pt+ or 14pt+ Bold)

✓ AA (3:1)✓ AAA (4.5:1)

UI Components & Graphics

✓ AA (3:1)

Anleitung

1Wählen Sie eine Vordergrundfarbe (Textfarbe)
2Wählen Sie eine Hintergrundfarbe
3Sehen Sie das Kontrastverhältnis und die WCAG-AA/AAA-Ergebnisse (bestanden/nicht bestanden)
4Verwenden Sie die Tausch-Schaltfläche, um die Farben umzukehren

Häufig gestellte Fragen

Die WCAG (Richtlinien für barrierefreie Webinhalte) definieren Mindestkontrastverhältnisse: AA erfordert 4,5:1 für normalen Text und 3:1 für großen Text; AAA erfordert 7:1 für normalen Text.

Großer Text ist definiert als 18pt (24px) oder größerer normaler Text, oder 14pt (ungefähr 18,67px) oder größerer fetter Text.