HEX-, RGB-, HSL- und CMYK-Codes, Kontrast für Barrierefreiheit, Abstufungen und Harmonien: alles, um deine Farben zu wählen.
| Format | Beispiel | Einsatzbereich |
|---|---|---|
| HEX | #6D5EF0 | Websites, Designprogramme |
| RGB | rgb(109, 94, 240) | Bildschirme, CSS, Bildbearbeitung |
| HSL | hsl(247, 83%, 65%) | Hellere oder dunklere Varianten erzeugen |
| CMYK | 55% 61% 0% 6% | Druck (Richtwert, ohne Farbprofil) |
Die Richtlinien für barrierefreie Webinhalte (WCAG) verlangen einen Kontrast von mindestens 4,5:1 für normalen Text (Stufe AA) und 7:1 für Stufe AAA. Großer Text kommt mit 3:1 aus. Das Werkzeug berechnet den Kontrast deiner Farbe auf Weiß und auf Schwarz: So weißt du sofort, ob sie sich für Text eignet.
Am Computer nimmt die Pipette die Farbe eines beliebigen Punkts auf dem Bildschirm auf, sofern dein Browser das unterstützt.
Füge den HEX-Code in das Feld ein: Das Werkzeug zeigt sofort den RGB-, HSL- und CMYK-Wert an, jeweils mit einer Schaltfläche zum Kopieren.
Mindestens 4,5:1 zwischen Text und Hintergrund für normalen Text, 3:1 für große Überschriften. Das Werkzeug zeigt an, ob deine Farbe diese Werte erreicht.
Sie sind Richtwerte: Die genaue Umrechnung hängt vom Farbprofil der Druckerei ab. Frag dort nach dem Profil, um ein originalgetreues Ergebnis zu erhalten.