Kontrast-Checker
Farbkontrast nach WCAG 2.1 prüfen – Verhältnis berechnen, AA/AAA testen, Vorschläge erhalten.
Vorschau
Häufige Fragen
Das Kontrastverhältnis beschreibt, wie stark sich Vordergrund- und Hintergrundfarbe in ihrer Helligkeit unterscheiden. Es wird aus den relativen Luminanzwerten beider Farben berechnet: (L1 + 0,05) / (L2 + 0,05), wobei L1 die hellere und L2 die dunklere Farbe ist. Das Ergebnis liegt zwischen 1:1 (kein Kontrast) und 21:1 (Schwarz auf Weiß).
WCAG 2.1 definiert zwei Konformitätsstufen für Kontrast. Stufe AA ist der gesetzlich oft geforderte Mindeststandard: normaler Text benötigt mindestens 4,5:1, großer Text mindestens 3:1. Stufe AAA ist die höchste Anforderung: normaler Text benötigt mindestens 7:1, großer Text mindestens 4,5:1. Als groß gilt Text ab 18 Punkt (24 px) oder ab 14 Punkt (ca. 18,67 px) in Fettschrift.
Großer Text ist nach WCAG 2.1 Text mit mindestens 18 Punkt (24 px) regulärer Schriftstärke oder mindestens 14 Punkt (ca. 18,67 px) fetter Schriftstärke. Für großen Text gilt die entspannte Schwelle: AA verlangt 3:1, AAA verlangt 4,5:1.
Wenn das gewählte Farbpaar ein WCAG-Kriterium nicht erfüllt, berechnet der Checker automatisch die nächstliegende Vordergrundfarbe, die das Kriterium knapp besteht. Dazu wird die Vordergrundfarbe schrittweise in Richtung Schwarz oder Weiß verschoben, bis das erforderliche Kontrastverhältnis erreicht ist. So bleibt der Farbcharakter möglichst erhalten.
Nein. WCAG 2.1 Erfolgskriterium 1.4.3 nimmt Logos, dekorative Texte, inaktive Bedienelemente und rein dekorative Elemente explizit aus. Die Kontrastanforderungen gelten nur für Text, der für die Vermittlung von Informationen notwendig ist.
WCAG 2.1 Kontrast: Warum Barrierefreiheit Farbe braucht
Die Web Content Accessibility Guidelines (WCAG) 2.1 legen fest, welchen Mindestkontrast Text gegenüber seinem Hintergrund aufweisen muss, damit Menschen mit eingeschränkter Sehfähigkeit – etwa bei Farbenblindheit oder niedrigem Sehvermögen – Inhalte sicher lesen können. In Deutschland ist AA seit dem BFSG (Barrierefreiheitsstärkungsgesetz) 2025 für viele digitale Produkte gesetzlich vorgeschrieben.
Wie funktioniert die Luminanzberechnung?
Grundlage ist die relative Luminanz nach IEC 61966-2-1: Jeder RGB-Kanal wird zunächst gamma-korrigiert (sRGB-Linearisierung), dann gewichtet summiert (R × 0,2126, G × 0,7152, B × 0,0722). Aus den Luminanzwerten beider Farben ergibt sich das Verhältnis. Wichtig: Selbst minimale Anpassungen im Blaukanal verändern die Luminanz kaum, während Änderungen im Grünkanal den stärksten Einfluss haben.
AA oder AAA – was ist sinnvoll?
AA ist das Pflichtminimum für Fließtext auf öffentlichen Webseiten und Apps. AAA sollte angestrebt werden für lange Lesetexte, kleine Schriftgrößen und Inhalte, die an Menschen mit stärkerer Sehbeeinträchtigung gerichtet sind. In der Praxis lassen sich nicht alle Designfarben auf AAA heben, ohne den Markenlook zu kompromittieren – hier empfiehlt sich zumindest AAA für Überschriften und AA für Fließtext.
