Design
Kontrastverhältnisse nach WCAG 2.1
Ausreichender Kontrast ist eines der häufigsten Barrierefreiheitsprobleme — und mit den richtigen Tools einfach zu beheben.
4,5:1
Normaler Text unter 18 pt / 14 pt fett (Stufe AA Kriterium 1.4.3)
3:1
Großer Text (≥ 18 pt normal / ≥ 14 pt fett) und UI-Komponenten (1.4.11, neu in 2.1)
7:1
Stufe AAA (Kriterium 1.4.6) — empfohlen für maximale Lesbarkeit
Empfohlene Tools zur Kontrastprüfung
- Color Contrast Analyzer (TPGi) — kostenlose Desktop-App für Windows und macOS
- WebAIM Contrast Checker — webbased, schnell und einfach
- Wawsome-Scanner — prüft alle Kontrastverhältnisse automatisch auf jeder Seite
- Figma Plugins — A11y Color Contrast Checker für Design-Phase
Häufiger Fehler: Viele Websites verwenden hellgrauen Text auf weißem Hintergrund (#999 auf #fff = nur 2,85:1 — nicht ausreichend). Mindestens #767676 auf weiß ergibt 4,54:1.
Bereit für eine barrierefreie Website?
Der Wawsome-Scanner prüft Ihre Website vollständig nach WCAG 2.1 und zeigt Ihnen klare Maßnahmen — kostenlos für 7 Tage.
Jetzt kostenlos testen →