RGB in HSL umrechnen
Wandeln Sie Rot-, Grün- und Blauwerte in Farbton, Sättigung und Helligkeit um – für einfacheres Anpassen von Farben in CSS.
rgb-Eingabe
Ergebnis · HSL
hsl(344, 100%, 62%)
HEX
#FF3D72
RGB
rgb(255, 61, 114)
HSV
hsv(344, 76%, 100%)
CMYK
cmyk(0%, 76%, 55%, 0%)
So funktioniert’s: RGB in HSL
- 1
Farbe eingeben
Geben Sie einen Farbcode ein oder wählen Sie eine Farbe mit dem Farbwähler – jedes Feld akzeptiert das angezeigte Format.
- 2
Umrechnung ansehen
Das Ergebnis aktualisiert sich sofort während der Eingabe, zusammen mit einer Live-Vorschau der Farbe.
- 3
Code kopieren
Kopieren Sie den gewünschten Wert mit einem Klick und fügen Sie ihn in Ihr Design, Ihr CSS oder Ihre Druckeinstellungen ein.
RGB im Vergleich zu HSL
RGB setzt eine Farbe aus drei Lichtkanälen zusammen. Das passt zu Bildschirmen, lässt sich aber schwer von Hand anpassen: Um rgb(255, 61, 114) etwas dunkler zu machen, müssen Sie alle drei Zahlen ändern. HSL beschreibt dieselbe Farbe als Farbton – einen Winkel auf dem Farbkreis von 0 bis 360° – sowie Sättigung und Helligkeit in Prozent, sodass aus diesem Pink hsl(344, 100%, 62%) wird.
Durch diesen Aufbau ist HSL ideal, um Abstufungen und Themes zu erstellen. Behalten Sie Farbton und Sättigung bei und senken Sie die Helligkeit für einen Hover- oder Aktiv-Zustand, erhöhen Sie sie für einen getönten Hintergrund, oder reduzieren Sie die Sättigung für eine gedämpfte Variante. Alle modernen Browser verstehen hsl() in CSS, Sie können das Ergebnis also direkt einfügen. Der Konverter rundet auf ganze Zahlen, daher kann sich beim Zurückrechnen ein Kanal um einen Schritt verschieben.
Alles läuft lokal in Ihrem Browser – Ihre Bilder werden nie auf einen Server hochgeladen.