Farbkontrast-Checker: WCAG AA/AAA Barrierefreiheit | Kostenlos

A WCAG fordert mindestens 4.5:1 für normalen Text (AA) und 7:1 für AAA.

A Ausreichender Kontrast stellt sicher, dass Text für alle Nutzer lesbar ist.

A Ja.

A Unser kostenloser Farbkontrast-Prüfer ist für feste Farbkombinationen ausgelegt. Wenn Sie Text über einem Farbverlauf verwenden, identifizieren Sie den Punkt im Verlauf, an dem Ihre Textfarbe den *geringsten* Kontrast aufweist. Sie sollten Ihre Vordergrund-Textfarbe sowohl mit den hellsten als auch den dunkelsten Abschnitten des Farbverlaufshintergrunds testen, um die WCAG AA- oder AAA-Konformität im gesamten Design sicherzustellen.

A Wenn Ihre Markenfarben den WCAG-Kontrast nicht bestehen, müssen Sie entweder Ihre Vordergrund- (Text) oder Hintergrundfarbe anpassen. Unser kostenloser Farbkontrast-Checker hilft Ihnen, schnell zu iterieren. Modifizieren Sie den Farbton, die Sättigung oder die Helligkeit der fehlerhaften Farbe geringfügig. Geben Sie die neuen Farbcodes erneut in das Tool ein und testen Sie sofort. Streben Sie das minimale Bestehensverhältnis an, während Sie so nah wie möglich an Ihrer Markenpalette bleiben, um die Lesbarkeit für alle Benutzer zu gewährleisten.

A Um die HEX-Farbcodes Ihrer Webseite zu finden, können Sie die Entwicklertools des Browsers nutzen. In den meisten Browsern (z.B. Chrome oder Firefox) klicken Sie mit der rechten Maustaste auf ein Element und wählen 'Untersuchen'. Das 'Elemente'- oder 'Styles'-Panel zeigt die CSS-Regeln, einschließlich der Farbeigenschaften. Alternativ können Sie eine Browser-Erweiterung wie ein 'Farbpipette'-Tool verwenden, um Farben direkt vom Bildschirm aufzunehmen und deren HEX-, RGB- oder HSL-Werte in unseren kostenlosen Farbkontrast-Checker einzugeben.

A Nein, dieses Tool funktioniert nur mit einfarbigen Farbpaaren. Für Bilder brauchen Sie andere Software. Machen Sie einen Screenshot des Bereichs und nehmen Sie mit einem Pipettenwerkzeug die hellsten und dunkelsten Pixel unter dem Text auf. Testen Sie beide gegen Ihre Textfarbe. Falls einer davon durchfällt, hilft oft eine halbtransparente Überlagerung hinter dem Text — etwa 40% schwarz ist ein guter Start.