What is the minimum contrast ratio for WCAG AA compliance?

For WCAG AA compliance, normal text requires a minimum contrast ratio of 4.5:1, while large text (18pt or 14pt bold) requires 3:1.

What is the difference between WCAG AA and AAA standards?

WCAG AAA requires higher contrast ratios: 7:1 for normal text and 4.5:1 for large text, compared to AA's 4.5:1 and 3:1 respectively.

How do I fix poor color contrast?

Use our automatic fix feature to adjust either text or background colors while maintaining your design intent, or manually adjust colors using HSL sliders with visual indicators showing optimal zones for AA/AAA compliance.

What are the visual indicators on the adjustment sliders?

The green zones and AA/AAA markers show optimal ranges for achieving WCAG compliance. The direction hints (Lighter/Darker) guide you toward better contrast based on your current color combination.

Can I test custom color combinations?

Yes, you can enter any hex color codes or use the color picker to select custom colors. The URL updates automatically so you can share specific color combinations.

Color Contrast Checker - WCAG AA & AAA Compliance Tool

Farben prüfen

Teste Farbkombinationen, um sicherzustellen, dass sie den WCAG-Zugänglichkeitsstandards für Textlesbarkeit entsprechen.

1.00:1

Kontrast

Nicht bestanden

Sehr schlecht

Normaler Text

AA (4.5:1)

AAA (7:1)

Großer Text

AA (3:1)

AAA (4.5:1)

Textfarbe

Hintergrundfarbe

Schnelle Lösungen

Vorschautitel

Der schnelle braune Fuchs springt über den faulen Hund

Kleiner Textbeispiel (12px)

Text

#ffffff

Hintergrund

#ff7d07

WCAG-Standards

Stufe AA

Minimales Kontrastverhältnis von 4,5:1 für normalen Text und 3:1 für großen Text. Erforderlich für die meisten Websites.

Stufe AAA

Erweitertes Kontrastverhältnis von 7:1 für normalen Text und 4,5:1 für großen Text. Empfohlen für optimale Zugänglichkeit.

Unzureichender Kontrast für alle Textgrößen - entspricht nicht den WCAG-Standards.

Farbkontrastprüfer

Berechne das Kontrastverhältnis von Text- und Hintergrundfarben.

Wähle eine Farbe mit dem Farbselektor für Text- und Hintergrundfarbe oder gib eine Farbe im RGB-Hexadezimalformat ein (z.B. #259 oder #2596BE). Du kannst den Schieberegler anpassen, um die Farbe auszuwählen. Die Web Content Accessibility Guidelines (WCAG) haben eine spezifische Richtlinie, um herauszufinden, ob Text für sehende Nutzer lesbar ist. Dieses Kriterium verwendet einen bestimmten Algorithmus, um Farbkombinationen in vergleichbare Verhältnisse zu überführen. Mit dieser Formel gibt WCAG an, dass ein Farbkontrastverhältnis von 4,5:1 zwischen Text und Hintergrund für normalen (Fließ-)Text ausreichend ist, und großer Text (18+ pt normal oder 14+ pt fett) sollte mindestens ein Kontrastverhältnis von 3:1 haben.

Hauptmerkmale

Echtzeit-Kontrastverhältnisberechnung
WCAG AA & AAA Konformitätsprüfung
HSL-Schieberegler zur Feinabstimmung
Mehrere Vorschauformate

Erweiterte Werkzeuge

Automatische Farbkorrektur
Text- und Hintergrundbeispiele
Farbnamen-Erkennung
Ergebnisse exportieren