What is a good color contrast ratio?

WCAG 2.1 requires a minimum contrast ratio of 4.5:1 for normal-sized text (AA level) and 3:1 for large text. For the stricter AAA level, the requirements are 7:1 for normal text and 4.5:1 for large text.

What counts as large text in WCAG?

Large text is defined as 18pt (24px) or larger for regular weight, or 14pt (18.66px) or larger for bold weight. Large text has lower contrast requirements because it is easier to read.

What is the difference between WCAG AA and AAA?

AA is the minimum level recommended for all web content. AAA is the highest (enhanced) level, providing better readability. Most organizations target AA compliance, while AAA is ideal for critical content like government sites.

How is contrast ratio calculated?

Contrast ratio is calculated using the relative luminance of two colors. The formula is (L1 + 0.05) / (L2 + 0.05), where L1 is the lighter color luminance and L2 is the darker. The result ranges from 1:1 (identical) to 21:1 (black on white).

← Zurück zu den Tools

Farbkontrast-Prüfer

Teste Vordergrund- und Hintergrundfarben gegen die WCAG-2.1-Barrierefreiheits-Standards. Sieh sofort Bestehen/Nichtbestehen-Ergebnisse für AA und AAA bei allen Schriftgrößen.

Vordergrundfarbe (Text)

Hintergrundfarbe

Live-Vorschau

Große Schrift Vorschau (24 px fett)

Normale Schrift Vorschau (16 px). Der schnelle braune Fuchs springt über den faulen Hund. Dieses Beispiel zeigt, wie deine Farbkombination bei Standard-Fließtextgröße aussieht.

Kleine Schrift Vorschau (14 px). Prüfe, ob das noch lesbar ist. Guter Kontrast sorgt dafür, dass alle Nutzer deinen Inhalt bequem lesen können.

Kontrastverhältnis4.47: 1

Normale SchriftGroße Schrift

AA (min. 4,5 / 3)

Nicht bestanden

Bestanden

AAA (min. 7 / 4,5)

Nicht bestanden

Über WCAG-Farbkontrast

♿ Warum Kontrast wichtig ist

Ausreichender Farbkontrast sorgt dafür, dass Text für alle lesbar ist, einschließlich Menschen mit Sehschwächen oder Farbsehschwächen. WCAG 2.1 setzt den globalen Standard.

📏 AA vs. AAA

AA verlangt 4,5:1 für normale Schrift und 3:1 für große Schrift. AAA ist strenger mit 7:1 bzw. 4,5:1. Die meisten Organisationen streben AA-Konformität als Mindestanforderung an.

📐 Definition von großer Schrift

Große Schrift ist mindestens 18 pt (24 px) bei normaler Stärke oder 14 pt (18,66 px) fett. Sie hat geringere Kontrastanforderungen, weil größere Glyphen leichter zu lesen sind.

⚡ Sofort & kostenlos

Keine Anmeldung, keine Server-Anfragen. Alles läuft in deinem Browser. Teste so viele Farbkombinationen, wie du willst.

Häufig gestellte Fragen

Was ist ein gutes Farbkontrastverhältnis?+

WCAG 2.1 verlangt ein Mindest-Kontrastverhältnis von 4,5:1 für normalgroßen Text (AA-Level) und 3:1 für große Schrift. Für das strengere AAA-Level liegen die Anforderungen bei 7:1 für normalen Text und 4,5:1 für große Schrift.

Was zählt in WCAG als große Schrift?+

Große Schrift wird definiert als 18 pt (24 px) oder größer bei normaler Stärke bzw. 14 pt (18,66 px) oder größer bei fetter Schrift. Große Schrift hat geringere Kontrastanforderungen, weil sie leichter zu lesen ist.

Was ist der Unterschied zwischen WCAG AA und AAA?+

AA ist das für alle Webinhalte empfohlene Mindestlevel. AAA ist das höchste (erweiterte) Level und bietet bessere Lesbarkeit. Die meisten Organisationen zielen auf AA-Konformität, während AAA ideal für kritische Inhalte wie Behördenseiten ist.

Wie wird das Kontrastverhältnis berechnet?+

Das Kontrastverhältnis wird mit der relativen Leuchtdichte zweier Farben berechnet. Die Formel lautet (L1 + 0,05) / (L2 + 0,05), wobei L1 die hellere und L2 die dunklere Leuchtdichte ist. Das Ergebnis reicht von 1:1 (identisch) bis 21:1 (Schwarz auf Weiß).

Farbkontrast-Prüfer

Live-Vorschau

Über WCAG-Farbkontrast

♿ Warum Kontrast wichtig ist

📏 AA vs. AAA

📐 Definition von großer Schrift

⚡ Sofort & kostenlos

Häufig gestellte Fragen

Mehr erfahren

Verwandte Tools

Hex zu RGB

Farbwähler

Paletten-Extraktor