Farbcode umwandeln — HEX, RGB, HSL, CMYK, Kontrastprüfung

Nützlich, um Farben aus einem Designentwurf in CSS-Code zu übertragen oder zu prüfen, ob Schaltflächentext nach Barrierefreiheitsstandards gut lesbar ist.

Die Datei wird nicht an den Server übertragen — die Verarbeitung erfolgt ausschließlich im Browser dieses Geräts

Kontrastprüfung (WCAG)

Dies ist der Kontrastwert dieser Farbe als Textfarbe gegenüber dem Hintergrund. Fließtext: AA 4,5:1, AAA 7:1 / Große Schrift (ab 24px oder fett ab 18,7px): AA 3:1, AAA 4,5:1.

Abc 가나다 123
Weißer Hintergrund6.29:1
✓ AA Fließtext ✗ AAA Fließtext ✓ AA große Schrift ✓ AAA große Schrift
Abc 가나다 123
Schwarzer Hintergrund3.34:1
✗ AA Fließtext ✗ AAA Fließtext ✓ AA große Schrift ✗ AAA große Schrift
Abc 가나다 123
Gewählte Farbe #FFFFFF6.29:1
✓ AA Fließtext ✗ AAA Fließtext ✓ AA große Schrift ✓ AAA große Schrift

Hell-/Dunkel-Stufen

Klicken Sie auf ein Feld, um den HEX-Code zu kopieren.

Werbung

So verwenden Sie Farbumwandlung

  1. 1Geben Sie einen Farbcode ein oder wählen Sie ihn mit dem Farbwähler aus (#4f46e5, rgb(), hsl() sind alle möglich).
  2. 2Der Code wird in allen Formaten angezeigt und durch Klicken kopiert.
  3. 3Prüft den Kontrastwert gegenüber Weiß, Schwarz oder einer gewählten Farbe, die WCAG-Konformität sowie Hell-/Dunkel-Stufen.

Häufig gestellte Fragen

Wie hoch muss der Kontrastwert mindestens sein?

WCAG AA erfordert mindestens 4,5:1 für Fließtext und 3:1 für große Schrift, AAA mindestens 7:1 bzw. 4,5:1.

Die CMYK-Werte weichen von der Druckerei ab.

Der hier angezeigte CMYK-Wert ist eine einfache mathematische Umrechnung. Der tatsächliche Druck hängt von Papier- und Tintenprofil ab – richten Sie sich nach den Vorgaben der Druckerei.

Werbung