Was bedeuten die WCAG-Level AA und AAA?

WCAG steht für Web Content Accessibility Guidelines. Das Level AA erfordert ein Kontrastverhältnis von 4,5:1 für normalen Text, während das strengere AAA-Level 7:1 verlangt.

Welches Format muss ich für die Eingabe der Farben verwenden?

Geben Sie die Farben zeilenweise im Format 'Name: #Hexcode' ein, zum Beispiel 'Hintergrund: #FFFFFF' oder 'Primär: #1D4ED8'.

Warum sollte ich meine Farbpalette auf Kontrast prüfen?

Ein ausreichender Farbkontrast stellt sicher, dass Texte für Menschen mit Sehschwächen gut lesbar sind und erfüllt gesetzliche Anforderungen zur digitalen Barrierefreiheit.

Was passiert, wenn eine Farbkombination durchfällt?

Das Tool listet die fehlgeschlagenen Paare im JSON-Ergebnis auf und gibt Hinweise, welche Farben angepasst werden müssen, um den Zielwert zu erreichen.

Kann ich auch große Texte (Large Text) prüfen?

Ja, Sie können im Dropdown-Menü spezielle Ziele für großen Text auswählen, da hier geringere Kontrastanforderungen gelten (z. B. 3:1 für AA Large Text).

Elysia Tools

Mobile Navigation

Design

Barrierefreier Farbkontrast-Pruefer

Prueft Farbpaare nach WCAG 2.1 AA und AAA und macht Anpassungsvorschlaege

Einzelheiten

Wobei dieses Tool hilft

Gut fuer Designsysteme, Markenpaletten und UI-Themen mit automatischen Kontrastbewertungen.

Ausführung

Dieses Tool ausführen

Fülle das Formular aus, starte das Tool und prüfe das Ergebnis an einem Ort.

Vorbereitete Beispielausführungen

Klicken Sie auf ein Beispiel, um das Formular automatisch auszufüllen. Dateien müssen weiterhin hochgeladen werden.

1 Beispiele

Eine Markenpalette fuer WCAG AA pruefen

Prueft alle Vordergrund-Hintergrund-Kombinationen und zeigt, welche Markenfarben angepasst werden muessen

{"summary":{"colorCount":4,"combinationCount":12,"failingCount":4},"recommendations":[{"pair":"brand-secondary on surface"}]}

Eingaben

Fülle die erforderlichen Felder aus und starte das Tool.

3 Optionen

InhaltHaupteingaben einfügen oder eingeben.1

PalettenfarbentextareaPflicht

EinstellungenFormate, Bereiche, Zahlen und Modi anpassen.1

WCAG-ZielselectOptionales Feld

SchalterOptionales Verhalten aktivieren oder deaktivieren.1

Gleiche Farbpaare einbeziehencheckboxOptionales FeldAktiviert, wenn ausgewählt

Ergebnis

Bereit zum Start

Nach dem Ausführen erscheinen hier Dateien, Text, strukturierte Daten oder Stream-Ausgaben.

Beispiele

Beispiele zu diesem Tool

Verwandt

Barrierefreier Farbkontrast-Pruefer

Wobei dieses Tool hilft

Dieses Tool ausführen

Vorbereitete Beispielausführungen

Eingaben

Ergebnis

Beispiele zu diesem Tool

Mit verwandten Tools und Themen fortfahren

Vorbereitete Beispielausführungen

Eingaben

Ergebnis

Erfahren Sie, wann dieses Tool passt, was es unterstützt und wie Nutzer es anwenden.

Wichtige Fakten

Überblick

Wann verwenden

So funktioniert es

Anwendungsfälle

Beispiele

1. Überprüfung einer neuen Markenpalette auf WCAG AA

2. Audit eines Dark Mode Themes für AAA-Konformität

FAQ

Farbcode-Beispiele

Android Java Bildverarbeitungsbeispiele

Android Kotlin Bildverarbeitungsbeispiele

Web Python Bildverarbeitung Beispiele

Farb-Barrierefreiheits-Prüfer

Farbkontrast-Prüfer

Pruefer fuer Farbseh-Barrierefreiheit

Barrierefreiheits-Auditbericht-Generator

Generatoren fur CSS-Effekte, Paletten und Design-Tokens

Tools fuer Web-Accessibility-Audits und lesbare Farbpruefung

Farbdesign- & Farbraum-Konvertierungswerkzeuge

Farbraum-Konvertierung fur Web und Druck