Zum Hauptinhalt springen
Förderungen bis zu $15.000/Jahr für Medien
InclusiveWeb

Kostenloses Tool

Farbkontrast-Prüfer

Prüfen Sie, ob Ihre Farbkombination den WCAG 2.1/2.2-Standards entspricht.

Kontrastverhältnis

6.29:1

Vorschau

Beispieltext auf Ihrem Hintergrund

WCAG 2.1/2.2 — Web Content Accessibility Guidelines

TextgrößeAA (Minimum)AAA (erweitert)
Normaler TextBestandenNicht bestanden
Großer Text (18px+ fett)BestandenBestanden

WCAG 2.1 Kriterium 1.4.3 (AA): mindestens 4.5:1 für Text, 3:1 für großen Text.

Farbkontrast verstehen

Das Kontrastverhältnis misst den Helligkeitsunterschied zwischen Text und Hintergrund — von 1:1 (kein Kontrast) bis 21:1 (Schwarz auf Weiß). Zu geringer Kontrast ist der häufigste WCAG‑Fehler im Web und macht Inhalte für Menschen mit Sehbehinderung, Farbenblindheit oder bei Sonnenlicht am Smartphone unlesbar. Die Einhaltung der WCAG‑Kontrastwerte ist eine Grundanforderung des Barrierefreiheitsstärkungsgesetzes (BFSG), des European Accessibility Act (EAA) und der EN 301 549.

So verwenden Sie den Kontrast‑Checker

Wählen oder fügen Sie eine Text‑ und eine Hintergrundfarbe ein. Das Tool berechnet sofort das WCAG‑Kontrastverhältnis und zeigt, ob das Paar AA und AAA für normalen und großen Text erfüllt. Passen Sie die Farben an, bis alle Prüfungen bestehen, und verwenden Sie diese Werte in Ihrem CSS.

Häufige Fragen zum Kontrast

Welches Kontrastverhältnis ist nach WCAG ausreichend?

Für WCAG 2.1/2.2 Stufe AA sind mindestens 4,5:1 für normalen Text und 3:1 für großen Text (24px oder 18,66px fett) erforderlich. Stufe AAA erhöht dies auf 7:1 bzw. 4,5:1.

Was ist der Unterschied zwischen WCAG AA und AAA?

AA ist die Standardstufe, die die meisten Gesetze (BFSG, EAA, EN 301 549) verlangen. AAA ist eine erhöhte Stufe für höchste Lesbarkeit. Ziel: überall AA und AAA wo möglich.

Gilt die Kontrastregel auch für großen Text?

Ja, aber mit niedrigerem Schwellenwert. Text ab 24px (oder 18,66px fett) benötigt bei AA nur 3:1 (4,5:1 bei AAA).

Brauchen Icons und UI‑Elemente ebenfalls Kontrast?

Ja. WCAG 1.4.11 verlangt ein Kontrastverhältnis von 3:1 für interaktive UI‑Komponenten (Buttons, Feldränder, Fokus‑Zustände) und bedeutungstragende Grafiken.

Ist dieser Kontrast‑Checker kostenlos?

Ja — das Tool läuft vollständig im Browser, benötigt keine Anmeldung und ist für unbegrenzte Prüfungen kostenlos.

Machen Sie Ihre Website in 3 Minuten barrierefrei

7 Tage kostenlos. Alle 3 Produkte. Keine Kreditkarte. Sofortige Ergebnisse.

Farbkontrast-Prüfer — WCAG-Rechner | InclusiveWeb