Farbwähler & Kontrastprüfer

So verwendest du den Farbwähler & Kontrastprüfer

Was es berechnet und wann man es nutzt

Wählt Farben aus und rechnet sie zwischen HEX, RGB, HSL, HSV und CMYK um, schlägt Aufhellungen, Abdunklungen und passende Farben vor und prüft den Textkontrast nach den WCAG-Richtlinien für Barrierefreiheit.

So geht’s, Schritt für Schritt

1. Wählen Sie eine Farbe mit dem Farbwähler oder geben Sie sie als HEX, RGB, HSL oder Farbnamen ein.
2. Wählen Sie eine Hintergrundfarbe, um den Kontrast zu prüfen.
3. Kopieren Sie jedes Format mit einem Klick.
4. Nutzen Sie Aufhellungen, Abdunklungen und passende Farben für eine Palette.

Was jede Eingabe bedeutet

• Farbe – Startwert #2443C8, SmartCalcy-Blau.
• Hintergrund – Startwert Weiß.

So lesen Sie die Ergebnisse

• Kontrastverhältnis – Von 1:1 bis 21:1, mit AA- und AAA-Ergebnissen für normalen und großen Text.
• Formate – HEX, RGB, HSL, HSV und CMYK.
• Aufhellungen und Abdunklungen – Hellere und dunklere Varianten.
• Passende Farben – Komplementär, analog und triadisch.

Die Formel

Kontrastverhältnis = (L1 + 0,05) ÷ (L2 + 0,05), wobei L1 und L2 die relativen Leuchtdichten der helleren und der dunkleren Farbe sind. WCAG AA verlangt 4,5:1 für normalen und 3:1 für großen Text; AAA verlangt 7:1 und 4,5:1.

Ein Rechenbeispiel

Mit den Startfarben hat #2443C8 auf Weiß ein Kontrastverhältnis von 7,74:1 und erfüllt damit AAA für alle Textgrößen.

Annahmen und Grenzen

• CMYK-Werte sind eine einfache Umrechnung, kein farbverwaltetes Druckprofil.
• Die Kontrastergebnisse folgen der WCAG-2-Formel.

Häufige Fehler

• Den Kontrast nur bei großem Text prüfen und die Farbe dann für kleinen Text verwenden.
• Bedeutung allein über Farbe vermitteln.

Häufige Fragen

Ähnliche Werkzeuge