Prüfen Sie Farbkontrastverhältnisse für die Einhaltung der Web-Barrierefreiheit. Testen Sie Text- und Hintergrundfarbkombinationen gemäß den WCAG-Richtlinien mit Echtzeit-Vorschau, Barrierefreiheitsbewertungen und Verbesserungsvorschlägen.
Textfarbe auswählen
Klicken Sie auf den ersten Farbwähler, um Ihre Textfarbe auszuwählen, oder geben Sie direkt einen Hex-Code ein.
Hintergrundfarbe wählen
Verwenden Sie den zweiten Farbwähler, um Ihre Hintergrundfarbe für den Kontrasttest auszuwählen.
Kontrastergebnisse prüfen
Überprüfen Sie das berechnete Kontrastverhältnis und sehen Sie die AA/AAA-Bewertungen für normalen und großen Text.
Ihr Design vorschauen
Sehen Sie sich die Live-Vorschau an, um zu sehen, wie Ihre Farbkombination mit echtem Textinhalt aussieht.
Echtzeit-Kontrastprüfung
Berechnen Sie Kontrastverhältnisse sofort, während Sie verschiedene Text- und Hintergrundfarbkombinationen auswählen.
WCAG-Konformitätsbewertungen
Erhalten Sie AA- und AAA-Bewertungen sowohl für normalen als auch für großen Text gemäß den Richtlinien für barrierefreie Webinhalte (WCAG).
Live-Vorschau-Panel
Sehen Sie genau, wie Ihre Farbkombinationen mit Beispieltext in normalen und großen Größen aussehen werden.
Visuelle Anzeige der Bewertung
Sehen Sie Ihre Kontrastleistung mit einem intuitiven Kreisdiagramm, das Bewertungen von 0-100 anzeigt.
Interaktive Farbwähler
Wählen Sie Farben einfach mit den integrierten Farbwähler-Tools für Text- und Hintergrundfarben.
Tipps zur Barrierefreiheit
Erhalten Sie praktische Vorschläge zur Verbesserung des Kontrasts und zur Einhaltung von Barrierefreiheitsstandards.
Ein Farbkontrast-Prüfer ist ein Tool, das den Helligkeitsunterschied zwischen Text- und Hintergrundfarben misst. Er berechnet Kontrastverhältnisse gemäß den WCAG-Standards (Web Content Accessibility Guidelines), um sicherzustellen, dass Inhalte für Benutzer mit Sehbehinderungen, einschließlich Farbenblindheit und geringer Sehkraft, lesbar sind.
WCAG-Konformität
Stellen Sie sicher, dass Ihre Designs internationale Barrierefreiheitsstandards mit präzisen AA- und AAA-Bewertungen erfüllen.
Echtzeit-Feedback
Sehen Sie sofortige Ergebnisse, während Sie Farben anpassen, was es einfach macht, konforme Kombinationen zu finden.
Visuelles Bewertungssystem
Verstehen Sie die Kontrastleistung auf einen Blick mit unserem intuitiven 0-100-Punktesystem.
Keine Installation erforderlich
Testen Sie Farbkombinationen sofort in Ihrem Browser, ohne Software herunterladen zu müssen.
Für normalen Text streben Sie mindestens 4,5:1 für AA-Konformität oder 7:1 für AAA an. Großer Text (18pt oder 14pt fett) benötigt 3:1 für AA oder 4,5:1 für AAA-Konformität.
AA ist die Standardstufe der Barrierefreiheitskonformität, die von den meisten Vorschriften gefordert wird. AAA ist die höchste Stufe und bietet erweiterte Barrierefreiheit für Benutzer mit stärkeren Sehbehinderungen.
Das Kontrastverhältnis wird anhand der relativen Luminanz von Farben berechnet, wie sie in den WCAG-Richtlinien definiert ist. Es reicht von 1:1 (kein Kontrast) bis 21:1 (maximaler Kontrast).
Großer Text ist definiert als 18 Punkt (24px) oder größer, oder 14 Punkt (18,66px) oder größer, wenn fett. Großer Text hat nachsichtigere Kontrastanforderungen.
Ein guter Farbkontrast stellt sicher, dass Inhalte für jeden lesbar sind, einschließlich Benutzer mit Sehbehinderungen, Farbenblindheit oder jene, die Inhalte bei hellem Sonnenlicht oder auf schlechten Bildschirmen betrachten.
Das Tool akzeptiert Hex-Farbcodes. Sie können andere Formate (RGB, HSL usw.) mithilfe von Online-Konvertern oder Design-Tools in Hex-Codes umwandeln.