Farbkontrast prüfen
Überprüfung WCAG AA und AAA Textkontrast für opake Hexfarben. Zeigen Sie Ihr Paar an, tauschen Sie Farben aus und wenden Sie eine kontrastreichere Textalternative an.
Kontrastbericht
Color contrast report
Text: #777777 Background: #ffffff Contrast ratio: 4.4781:1
- AA · normal text: Fail (requires 4.5:1)
- AA · large text: Pass (requires 3:1)
- AAA · normal text: Fail (requires 7:1)
- AAA · large text: Fail (requires 4.5:1)
Large text: at least 24 CSS px, or approximately 18.67 CSS px when bold. This checks opaque sRGB text contrast only, not overall accessibility.
Exporttexte bleiben auf Englisch; deine Eingaben werden unverändert übernommen.
Keine Anmeldung. Keine AI Credits. Dieses Tool stellt Ihre Ausgabe in Ihrem Browser zusammen.
Von einer Idee zu etwas Nützlichem.
- 01
Geben Sie Text- und Hintergrundfarben ein.
- 02
Überprüfen Sie das berechnete Verhältnis und die normalen oder großen Textschwellen.
- 03
Probieren Sie eine vorgeschlagene Textfarbe aus und exportieren Sie das Ergebnis.
Ein kleiner Kontext.
Kontrastverhältnisse verwenden die WCAG relative Leuchtdichteformel für opake sRGB-Farben. AA normaler Text erfordert 4,5:1 und AA großer Text erfordert 3:1. Großer Text bedeutet in der Regel mindestens 24 CSS Pixel, oder ungefähr 18,67 CSS Pixel in Fettdruck. Das Rohverhältnis bestimmt das Ergebnis vor dem Runden. Dies ist ein Farbcheck, kein Zugänglichkeitsaudit.
Gute Fragen.
Kann ich transparente Farben eingeben?
Nein. Verwenden Sie opake drei- oder sechsstellige Hexwerte. Komposit transparente Farben auf ihren endgültigen Hintergrund vor der Messung.
Bedeutet ein Überholverhältnis, dass meine Seite zugänglich ist?
Nein. Tastaturnavigation, Semantik, Fokus, lesbare Größen und andere Anforderungen müssen noch getestet werden. Das Tool wertet nur dieses Text/Hintergrundpaar aus.