Zum Inhalt springen
Barrierefreiheit

Farbkontrast-Checker

Prüfe ob deine Farbkombinationen WCAG-konform sind und für alle Nutzer gut lesbar bleiben.

Überschrift Beispiel

Dies ist ein Beispieltext in normaler Größe. So sieht der Farbkontrast auf deiner Website aus.

Kleiner Text — auch hier sollte die Lesbarkeit gewährleistet sein.

Button BeispielGefüllter Button

17.06:1

Kontrast-Verhältnis

Exzellent

Bewertung

5/5

WCAG bestanden

WCAG 2.1 Konformität

AA Normal Text

4.5:1

Normaler Text (< 18pt)

Bestanden

AA Großer Text

3:1

Großer Text (≥ 18pt / 14pt bold)

Bestanden

AAA Normal Text

7:1

Höchster Standard — Normaler Text

Bestanden

AAA Großer Text

4.5:1

Höchster Standard — Großer Text

Bestanden

UI-Komponenten

3:1

Buttons, Icons, Rahmen

Bestanden

Brauchst du professionelles UI/UX-Design mit barrierefreiem Farbkonzept?

Kostenlose Beratung buchen