Welche WCAG-Stufen werden geprüft?

Sowohl AA als auch AAA, für normalen Text (≤17pt) und großen Text (≥18pt oder ≥14pt fett).

Welches Verhältnis benötige ich?

AA: 4,5:1 normal, 3:1 groß. AAA: 7:1 normal, 4,5:1 groß. Die meisten öffentlichen Websites streben mindestens AA an.

Wie wird der Kontrast berechnet?

Gemäß WCAG 2.x: relative Leuchtdichte jeder Farbe, dann (heller + 0,05) / (dunkler + 0,05). Das Ergebnis ist ein Verhältnis von 1:1 (kein Kontrast) bis 21:1 (max).

Was ist mit WCAG 3 / APCA?

Aktuell verwenden wir WCAG 2-Verhältnisse – den offiziellen Standard für AA/AAA-Konformität. WCAG 3 / APCA ist noch ein Entwurf.

Ist der Checker kostenlos?

Ja – komplett kostenlos, keine Anmeldung erforderlich.

Farbe & Design

Kontrast-Checker (WCAG)

Kostenloser WCAG-Kontrastprüfer. Überprüfen Sie den Kontrast zwischen zwei beliebigen Farben – sehen Sie AA/AAA-Bestanden/Nicht bestanden für normalen und großen Text. Für barrierefreies Design und a11y.

Runs in your browser

Contrast checker (WCAG)

Foreground

Background

The quick brown fox

jumps over the lazy dog · 14px sample

Ratio

17.85:1

AA · normal

Pass

AA · large

Pass

AAA · normal

Pass

AAA · large

Pass

Anmerkung der Redaktion

Understanding · Designing for the eye on the bus.

Dieses ausführliche Kapitel ist derzeit nur auf Englisch verfügbar. Das Konvertierungstool oben funktioniert in Ihrer Sprache; der lange Erklärtext wurde noch nicht übersetzt.

Häufig gestellte Fragen

Quick answers.

›What WCAG levels are checked?

Both AA and AAA, for normal text (≤17pt) and large text (≥18pt or ≥14pt bold).

›What ratio do I need?

AA: 4.5:1 normal, 3:1 large. AAA: 7:1 normal, 4.5:1 large. Most public sites target AA at minimum.

›How is contrast calculated?

Per WCAG 2.x: relative luminance of each color, then (lighter + 0.05) / (darker + 0.05). The result is a ratio from 1:1 (no contrast) to 21:1 (max).

›What about WCAG 3 / APCA?

Currently we use WCAG 2 ratios — the official standard for AA/AAA conformance. WCAG 3 / APCA is still a draft.

›Is the checker free?

Yes — fully free, no signup.

Andere suchten auch nach

Verwandte Artikel

Aus dem Blog.(1)

OKLCH for designers: why switch from HSL
Design5 min read

Use with

What people reach for next.

Color Converter (HEX/RGB/HSL/OKLCH)
Adjust the failing colour by lightness, not hue.

Verwandte Tools

More in this room.

Alle anzeigen in Farbe & Design