Was ist WCAG-Kontrastprüfer?

Ein WCAG-Farbkontrast-Checker, der das Kontrastverhältnis zwischen Vordergrund- und Hintergrundfarben berechnet und prüft, ob die Kombination den WCAG-2.1-Level-AA- und AAA-Anforderungen für normalen und grossen Text entspricht.

Anleitung

  1. Geben Sie eine Vordergrundfarbe (Text) und eine Hintergrundfarbe über die Farbwähler oder Hex-Eingaben ein.
  2. Sehen Sie das Kontrastverhältnis und die Bestanden/Nicht-bestanden-Ergebnisse für WCAG-AA- und AAA-Konformitaet für normalen Text, grossen Text und UI-Komponenten.
  3. Falls der Kontrast nicht ausreicht, nutzen Sie die vorgeschlagenen Farbanpassungen, um die nächstgelegene barrierefreie Farbkombination zu finden.

Ergebnis

Ein UI-Designer prüft sein Markenblau #3B82F6 auf weißem Hintergrund #FFFFFF, das 4,5:1-Verhältnis besteht AA für grossen Text, scheitert aber an AAA für normalen Text. Er dunkelt auf #2563EB (5,3:1) ab, um beide Standards zu erfüllen.

Ähnliche Tools