Color Contrast Checker

Check WCAG AA/AAA contrast ratio between two colors

Über diesen Rechner

Der Farbkontrast-Prüfer berechnet das WCAG-2.x-Kontrastverhältnis zwischen einer Vordergrund- und einer Hintergrundfarbe mit der Formel für die relative Leuchtdichte (L1 + 0,05) / (L2 + 0,05). Er akzeptiert Eingaben als #rgb, #rrggbb und rgb(r,g,b) und gibt das exakte Verhältnis, die Leuchtdichte beider Farben und Bestanden-/Durchgefallen-Markierungen für AA und AAA bei normalem Text (4,5:1 / 7:1) und großem Text (3:1 / 4,5:1) aus. Ungültige Farben liefern einen Fehler. Unverzichtbar für barrierefreies Webdesign.

So nutzen Sie das Color Contrast Checker-Tool

  1. Geben Sie Ihre Eingabe in das Feld ein oder fügen Sie sie ein.
  2. Lesen Sie die Ausgabe ab — sie aktualisiert sich sofort, während Sie tippen.
  3. Passen Sie die Optionen, falls vorhanden, an Ihren Anwendungsfall an.
  4. Kopieren Sie die URL der Seite, um das exakte Ergebnis zu teilen.

Häufige Beispiele

  • #000000 auf #ffffff → 21,0000:1 — besteht jede AA- und AAA-Stufe
  • #777777 auf #ffffff → 4,4781:1 — scheitert bei AA für normalen Text um Haaresbreite, besteht AA für großen Text
  • #0066cc auf #ffffff → 5,5666:1 — AA bestanden, AAA für normalen Text nicht
  • #ffcc00 auf #333333 → 8,3564:1 — besteht AAA für alle Textgrößen

Häufig gestellte Fragen

Wie funktioniert das Color Contrast Checker-Tool?

Geben Sie Ihre Eingabe ein oder fügen Sie sie ein, und das Tool verarbeitet sie direkt in Ihrem Browser und zeigt das Ergebnis sofort an. Nichts von dem, was Sie eingeben, wird auf einen Server hochgeladen — die gesamte Berechnung findet auf Ihrem Gerät statt.

Wann brauche ich das Color Contrast Checker-Tool?

Es ist praktisch für Entwicklung, Debugging, Design und Administrationsaufgaben — immer wenn Sie diese Umwandlung oder Prüfung schnell erledigt brauchen, ohne etwas zu installieren oder Ihre Daten einem Drittanbieterdienst anzuvertrauen.

Wie zuverlässig sind die Ergebnisse?

Das Tool implementiert den einschlägigen Standard oder die Spezifikation direkt, sodass seine Ausgabe dem entspricht, was konforme Software erzeugt. Randfälle wie leere oder fehlerhafte Eingaben werden klar gemeldet, statt still zu scheitern.

Kann ich ein bestimmtes Ergebnis mit jemand anderem teilen?

Ja. Ihre Eingabe aktualisiert die URL — wenn Sie die Adressleiste kopieren und den Link teilen, öffnet sich das Tool für jeden, der ihn anklickt, im selben Zustand.