Farbkontrast-Prüfer Online
Farbkontrast nach WCAG 2.1 prüfen. AA- und AAA-Barrierefreiheitskonformität sofort verifizieren.
Sample Text
This is a normal text paragraph to verify readability.
#1a1a1f
#f8f6f3
Warum dieses Tool nutzen
Web-Barrierefreiheit ohne Rätselraten bei Kontrastverhältnissen
Offizielles WCAG 2.1
Verwendet die exakte relative Luminanzformel des W3C. Präzise, konforme Ergebnisse.
AA und AAA auf einen Blick
Sieh sofort, ob deine Kombination die gesetzlich geforderte Mindeststufe erfüllt.
Sofortige Verarbeitung
Echtzeitberechnung während du die Farben änderst.
Keine Anmeldung
Farben prüfen ohne Konten oder Installation.
So funktioniert es
Drei Schritte, kein Aufwand
Farben eingeben
Wähle Text- und Hintergrundfarbe über den Farbwähler oder gib direkt Hex-, RGB- oder HSL-Werte ein.
Kontrastverhältnis erhalten
Das Kontrastverhältnis wird sofort mit der relativen Luminanzformel aus WCAG 2.1 berechnet. Sieh, ob es die AA- und AAA-Stufen erfüllt.
Anpassen bis zur Konformität
Wenn der Kontrast die Anforderungen nicht erfüllt, passe die Farben an. Der Checker zeigt dir, welche Konformitätsstufe deine Farbkombination erreicht.
FAQ
Noch Fragen?
WCAG (Web Content Accessibility Guidelines) sind die Richtlinien zur Barrierefreiheit von Webinhalten, entwickelt vom W3C (World Wide Web Consortium). Sie sind der internationale Referenzstandard, um Webinhalte für Menschen mit visuellen, auditiven, motorischen und kognitiven Einschränkungen zugänglich zu machen. Die aktuelle Version ist WCAG 2.1 (veröffentlicht im Juni 2018); WCAG 2.2 wurde im Oktober 2023 mit zusätzlichen Erfolgskriterien veröffentlicht. WCAG 3.0 ist in Entwicklung und schlägt ein neues Kontrastmodell basierend auf APCA (Advanced Perceptual Contrast Algorithm) vor.
WCAG definiert drei Konformitätsstufen. Stufe A: Grundanforderungen, die, wenn sie nicht erfüllt sind, Inhalte unzugänglich machen. Stufe AA: der empfohlene Standard für die meisten Websites; in vielen Ländern gesetzlich vorgeschrieben. Stufe AAA: der höchste Barrierefreiheitsstandard, nicht immer für alle Inhalte erreichbar. Für Farbkontrast: 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 und 4,5:1 für großen Text. Web-Barrierefreiheitsgesetze (ADA in den USA, EAA in Europa) verlangen im Allgemeinen Stufe AA.
Das Kontrastverhältnis ist eine Zahl zwischen 1:1 (kein Kontrast, identische Farben) und 21:1 (maximaler Kontrast, Schwarz auf Weiß). Es wird berechnet als (L1 + 0,05) / (L2 + 0,05), wobei L1 die relative Luminanz der helleren Farbe und L2 die der dunkleren ist. Die relative Luminanz einer sRGB-Farbe wird berechnet, indem jeder Kanal (R, G, B) von Gamma in Linear transformiert wird: Bei normiertem Wert ≤ 0,03928 wird Kanal/12,92 verwendet, sonst ((Kanal+0,055)/1,055)^2,4. Die endgültige Luminanz beträgt 0,2126×R + 0,7152×G + 0,0722×B.
In den Vereinigten Staaten gilt der Americans with Disabilities Act (ADA) für Websites betroffener Einrichtungen, und Gerichte haben WCAG 2.1 Stufe AA als anwendbaren Standard festgelegt. In Europa trat der European Accessibility Act (Richtlinie 2019/882) am 28. Juni 2025 in Kraft und verlangt, dass digitale Produkte und Dienstleistungen Zugänglichkeitsstandards entsprechen, die WCAG 2.1 AA entsprechen. Das Ignorieren dieser Anforderungen kann zu Rechtsstreitigkeiten und Bußgeldern führen.
WCAG 2.1 definiert großen Text als Text mit mindestens 18 Punkt (ca. 24 px) bei normalem Gewicht oder mindestens 14 Punkt (ca. 18,67 px) bei Fettdruck (font-weight 700 oder höher). Dieser Text hat eine geringere Kontrastanforderung (3:1 für AA statt 4,5:1), weil die größere Schriftgröße die Lesbarkeit auch bei niedrigerem Kontrast unterstützt. Logos und rein dekorativer Text sind von Kontrastanforderungen ausgenommen. UI-Komponenten (Schaltflächen, Eingabefelder) erfordern mindestens 3:1 für ihre aktiven Bereiche (Kriterium 1.4.11 Nicht-Text-Kontrast).
WCAG-Farbkontrast: Web-Barrierefreiheit, Gesetzgebung und Algorithmen
Die Web Content Accessibility Guidelines (WCAG) entstammen der Web Accessibility Initiative (WAI) des W3C, die 1997 gestartet wurde. WCAG 1.0 wurde im Mai 1999 veröffentlicht. WCAG 2.0 erschien im Dezember 2008 und führte das Vier-Prinzipien-Modell ein: Wahrnehmbar, Bedienbar, Verständlich und Robust (POUR). WCAG 2.1 (Juni 2018) fügte 17 neue Erfolgskriterien hinzu, insbesondere für mobile Nutzer, Menschen mit Sehschwäche und Nutzerinnen und Nutzer mit kognitiven Einschränkungen. Kriterium 1.4.3 (Mindestkontrast) legt die Kontrastanforderungen fest, die dieses Tool notwendig machen. Section 508 des US Rehabilitation Act (2017 aktualisiert) verweist auf WCAG 2.0 Stufe AA für föderale Informationstechnologie.
Die relative Luminanzformel von WCAG basiert auf dem sRGB-Farbraum (IEC 61966-2-1), dem Standard für Computermonitore seit 1999. Die sRGB-Gamma-zu-Linear-Transformation (die Operation ((c+0,055)/1,055)^2,4 für Werte über 0,03928) approximiert die tatsächliche Gamma-Kurve des sRGB-Standards. Die Luminanzkoeffizienten (0,2126 für Rot, 0,7152 für Grün, 0,0722 für Blau) spiegeln die Empfindlichkeit des menschlichen Auges für jede Wellenlänge wider, basierend auf der Arbeit der Internationalen Beleuchtungskommission (CIE). Lea Verou, MIT-Forscherin und Mitglied der W3C CSS Working Group, entwickelte 2012 eine weit zitierte Referenzimplementierung und erstellte das Tool contrast-ratio.com.
WCAG 3.0 (derzeit im Entwurf) schlägt vor, die aktuelle Kontrastformel durch APCA (Advanced Perceptual Contrast Algorithm) von Andrew Somers zu ersetzen. APCA modelliert die menschliche Sehwahrnehmung besser, indem es Kontrastpolarität (dunkler Text auf hellem Hintergrund wird anders wahrgenommen als heller Text auf dunklem), Schriftgröße und -gewicht sowie die visuelle Systemadaption berücksichtigt. Die APCA-Skala reicht von 0 bis 106 Lc (Lightness Contrast), und ihre Schwellenwerte unterscheiden sich erheblich von WCAG-2.x-Verhältnissen. Der Übergang zu WCAG 3.0 wird schrittweise erfolgen, und die endgültige Version wird vor 2026 nicht erwartet.