WCAG-Farbkontrastprüfer
Bewerten Sie das Kontrastverhältnis von Text- und Hintergrundfarben gemäß den WCAG 2.1-Richtlinien. Erstellen Sie sofort barrierefreie Farbanpassungen.
Live-Textvorschau
Große Überschrift (18pt Fett / 24pt Normal)
Dies ist eine Vorstellung des großen Titeltextstils.
Normaler Text (unter 18pt)
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Kontrastverhältnis
WCAG 2.1 Konformitätsstatus
WCAG 2.1 Richtlinien
Überprüfen Sie einfach Kontraststandards, um barrierefreie Schnittstellen zu erstellen, die den Richtlinien von Section 508, ADA und WCAG AA oder AAA entsprechen.
Vorschlags-Engine
Automatisch passen Sie die Farben zunehmend entlang der HSL-Koordinate an, um die nächsten Alternativen zu finden, die den Kontrastverhältniskriterien erfüllen.
Vollständig Client-seitig
Berechnungen werden lokal in Ihrem Browser-Kontext ausgeführt. Es werden keine Farben, Dateien oder Telemetrie-Koordinaten an unsere Server übertragen.
Verwandte Farbtools
Farbkontrastprüfer
Berechnen Sie die Kontrastrate WCAG für Vor- und Hintergrundfarben und zeigen Sie gemeinsame Textgröße Ergebnisse.
- Eingabe
- 2 gültige CSS-Farbwärme und optionale Vorschautext.
- Ausgabe
- Ein Kontrastverhältnis mit WCAG AA und AAA Pass oder Fail-Indikatoren.
- Reale Einschränkungen
- Die Berechnung deckt nur den Lichtkontrast ab; es zertifiziert keine Schnittstelle oder Rechnung für Font rendering, Bewegung, Fokus oder nicht-Farb-Kugeln.
- Datenschutz und Datenverarbeitung
- Zwei gültige CSS-Farbe und optionale Vorschautext werden in dieser Browserkarte verarbeitet. Converter erhält es nicht oder speichert es; Schließen oder neu laden die Seite reinigt den Arbeitsstatus, es sei denn, das Tool explizit eine lokale Download bietet.
Wie man dieses Tool verwendet
- Bereitstellung von zwei gültigen CSS-Farbwärmen und optionalen Vorschautext in den Tool-Controls.
- Wählen Sie die Einstellungen, die einen Kontrastverhältnis mit WCAG AA und AAA Pass oder Fehlindikatoren beeinflussen, und führen Sie das Tool aus.
- Überprüfen Sie ein Kontrastverhältnis mit WCAG AA und AAA Pass oder Fehlindikatoren vor Kopieren oder Herunterladen.
Einheitliche Versagenmodes
Invalidfarben können nicht gemessen werden, und Transparenz ohne eine gelöschte Hintergrund kann einen Verhältnis sinnlos machen.
nützliches Beispiel
Vergleichen Sie den #f2106 auf #ffffff, um seinen Verhältnis zu normalen und großen Text zu überprüfen.