Operativ
Farbkontrastprüfer
Werbung
Preview
Normal Text (16px)
Large Text (24px)
Contrast Ratio
21.00:1
WCAG Compliance
Normal Text
✓
AA Pass
✓
AAA Pass
Large Text (18pt+ or 14pt+ bold)
✓
AA Pass
✓
AAA Pass
UI Components & Graphics
✓
AA Pass
WCAG Standards
Normal Text
- AA: 4.5:1 minimum
- AAA: 7:1 minimum
Large Text
- AA: 3:1 minimum
- AAA: 4.5:1 minimum
UI Components
- AA: 3:1 minimum
Common Combinations
Black on White
White on Blue
White on Dark Gray
Geben Sie unten Ihre Farbkombinationen ein, um sie mit unserem Farbkontrastprüfer zu testen und sofort zu sehen, ob sie den Barrierefreiheitsstandards entsprechen.
So funktioniert unser Farbkontrastprüfer
Geben Sie Ihre Vordergrund-- undHintergrund-Farben mithilfe von RGB-Hexadezimalwerten ein oder wählen Sie sie direkt mit dem Farbwähler aus.
- Passen Sie Alpha an, um die Transparenz der Vordergrundfarbe zu ändern.
- Verwenden Sie den Schieberegler Helligkeit, um die Farbe heller oder dunkler erscheinen zu lassen.
Unser Tool berechnet dann das Kontrastverhältnis und prüft es anhand der WCAG-Richtlinien:
- WCAG 2.0 Level AA
- Mindestens 4,5:1 für normalen Fließtext
- Mindestens 3:1 für großen Text
- WCAG 2.1 (Benutzeroberfläche und Grafiken)
- Mindestens 3:1 für Symbole, Rahmen und andere Schnittstellenkomponenten
- WCAG-Stufe AAA
- Mindestens 7:1 für normalen Text
- Mindestens 4,5:1 für großen Text
Großer Text bedeutet entweder:
- 14 pt (ca. 18,66 px) und fett, oder
- 18 pt (ca. px) oder größer
Sie können die Pipette im Farbwähler verwenden, um exakte Farben von allem auf Ihrem Bildschirm zu erfassen.
Verwenden Sie für Links, deren Hervorhebung allein auf der Farbe beruht, unseren Farbkontrastprüfer, um sicherzustellen, dass sie den Barrierefreiheitsstandards entsprechen und für alle gut lesbar bleiben.