WCAG-Farbkontrast-Prüfer

Vorder- und Hintergrund-CSS-Farben einfügen, um WCAG-2.2-AA/AAA- und Nicht-Text-3:1-Urteile mit Kontrastverhältnis zu sehen. HEX, RGB, HSL, OKLCH, color() und benannte Farben funktionieren in Paar- und Matrixansicht. Im Browser geprüft, nie gesendet.

Laden…
WCAG-Farbkontrast-Prüfer
Fügen Sie CSS-Farben ein, um Kontrastverhältnis und WCAG-2.2-Konformität abzulesen. Der Matrixmodus akzeptiert bis zu 16 Farben pro Achse und meldet bei mehr Farben einen Fehler. APCA ist optional, als Beta gekennzeichnet und wird nie mit WCAG-Werten zusammengeführt.

Entwicklerhinweise

WCAG 2.2 ist die Standardgrundlage für bestanden/nicht bestanden (1.4.3, 1.4.6, 1.4.11). Vordergrund-Alpha wird vor dem Verhältnis über den Hintergrund komponiert. Matrix-Obergrenze: 16 Farben pro Achse. Eine 17. Farbe zeigt einen Fehler, nie stilles Abschneiden. APCA nutzt die unabhängige color.js-Implementierung, nicht das apca-w3-npm-Paket. Die teilbare URL speichert den Arbeitszustand. Die Schaltflächen zum Teilen in sozialen Netzwerken sind getrennt.

Optionen

  • APCA-Überlagerung (Beta) — Zeigt APCA Lc in einem separaten, beschrifteten Abschnitt. Standard aus. Impliziert nie WCAG-3-Konformität.
  • Textgröße und -stärke — Setzt WCAG-Großtext-Schwellen und die Beispielvorschau. Standard 20px / 400 (Normaltext).
  • Vordergrund-Alpha — Komponiert den Vordergrund über den Hintergrund vor der Verhältnisberechnung. Standard 1 (deckend).
  • Matrix-Konformitätsfilter — Zeigt oder blendet AAA-, AA-, Groß-AA- und Fehlerzellen in der Matrix aus. In Einzelpaar-Ansicht ausgeblendet.

Verwandte CSS-Tools

Hub: Farb- & CSS-Tools. Stylesheets verkleinern oder formatieren mit CSS minimieren und Verschönern CSS.

FAQ zum WCAG-Farbkontrast-Prüfer

Lokaler Prüfer mit WCAG im Mittelpunkt

Ist APCA dasselbe wie WCAG 3?

Nein. APCA ist eine optionale Beta-Überlagerung in einem separaten Abschnitt. WCAG 2.2 AA/AAA bleibt auf dieser Seite die Konformitätsgrundlage.

Werden meine Farben hochgeladen?

Nein. Parsing und Kontrastberechnung laufen vollständig in Ihrem Browser. FastMinify sendet Farben nie an einen Server.

Welche Einfügeformate funktionieren?

HEX, RGB, HSL, OKLCH, CSS color() einschließlich display-p3 und benannte CSS-Farben. Ein Format-Umschalter ist nicht nötig.

Wie viele Matrixfarben sind erlaubt?

Bis zu 16 pro Achse (max. 256 Zellen). Bei mehr Farben erscheint ein sichtbarer Fehler.

Lokal eingefügte WCAG-Kontrastprüfung mit moderner CSS-Farbsyntax — Paar- und Matrixansicht, nie hochgeladen.