Kostenloser Farbkontrast-Prüfer
Testen Sie Farbkontrastverhältnisse gegen WCAG 2.1-Barrierefreiheitsstandards. Prüfen Sie AA- und AAA-Konformität für Textlesbarkeit. Kostenlos, sofort und privat.
Der Farbkontrast-Prüfer testet beliebige Vordergrund-/Hintergrund-Paare gegen die WCAG-2.1-Standards AA und AAA mit der Formel der relativen Luminanz. Zeigt Kontrastverhältnis, Bestanden/Nicht bestanden pro Textgröße und UI-Komponenten, Live-Vorschau und Farbenblindheits-Simulation für Protanopie, Deuteranopie und Tritanopie. Schlägt bestehende Alternativen bei Fehlschlag vor. Läuft vollständig im Browser. Erstellt von FreeToolHub.
| Normaler Text | Großer Text | |
|---|---|---|
| WCAG AA | ✓ Bestanden Erfordert 4,5:1 Verhältnis | ✓ Bestanden Erfordert 3:1 Verhältnis |
| WCAG AAA | ✓ Bestanden Erfordert 7:1 Verhältnis | ✓ Bestanden Erfordert 4,5:1 Verhältnis |
| UI-Komponenten | ✓ Bestanden Erfordert 3:1 Verhältnis (WCAG 2.1) | |
Häufig gestellte Fragen
Was ist ein Farbkontrastverhältnis?
Ein Kontrastverhältnis misst den Unterschied in der wahrgenommenen Helligkeit zwischen zwei Farben, ausgedrückt als Verhältnis von 1:1 (kein Kontrast, identische Farben) bis 21:1 (maximaler Kontrast, Schwarz auf Weiß). Es wird mit der WCAG-Formel für relative Leuchtdichte berechnet.
Welches Kontrastverhältnis brauche ich für WCAG-Konformität?
WCAG AA erfordert ein Mindestkontrastverhältnis von 4,5:1 für normalen Text und 3:1 für großen Text (18pt oder 14pt fett). WCAG AAA erfordert 7:1 für normalen Text und 4,5:1 für großen Text. UI-Komponenten erfordern mindestens 3:1 nach WCAG 2.1.
Was zählt als "großer Text" in WCAG?
Großer Text ist definiert als 18 Punkt (24px) oder größer bei normalem Gewicht, oder 14 Punkt (ca. 18,66px) oder größer bei fetter Schrift. Großer Text hat niedrigere Kontrastanforderungen, da er von Natur aus leichter zu lesen ist.
Warum ist Farbkontrast für Barrierefreiheit wichtig?
Etwa 1 von 12 Männern und 1 von 200 Frauen haben eine Form von Farbsehschwäche. Text mit niedrigem Kontrast ist für Menschen mit Sehschwäche oder Farbenblindheit schwer oder unmöglich zu lesen. Ausreichender Kontrast stellt sicher, dass Ihre Inhalte von allen gelesen werden können.
Speichert dieses Tool meine Farbauswahl?
Nein. Alles läuft lokal in Ihrem Browser. Es werden keine Farben, Ergebnisse oder Daten an einen Server gesendet oder gespeichert. Ihre Privatsphäre ist vollständig geschützt.
Wie funktioniert die Farbvorschlagsfunktion?
Wenn ein Farbpaar ein WCAG-Level nicht besteht, berechnet das Tool automatisch die nächstliegende Farbe, die bestehen würde, indem die Helligkeit im HSL-Farbraum angepasst wird, während Farbton und Sättigung erhalten bleiben. Es schlägt sowohl einen dunkleren Vordergrund als auch einen helleren Hintergrund vor.