AbraCalc

Hex in HSL Farbumrechner

Rechnen Sie einen CSS-Hex-Farbcode in einem Klick in HSL (Hue, Saturation, Lightness) um.

Von · Geprüft von AbraCalc Methodology Review · 2 Quellen

Dieses Tool auf deiner Seite einbetten
Dieses Tool zitieren

APA

AbraCalc. (2026). Hex in HSL Farbumrechner [Online calculator]. Retrieved from https://abracalc.com/de/hex-in-hsl/

BibTeX

@misc{abracalc-hex-in-hsl, author = {AbraCalc}, title = {Hex in HSL Farbumrechner}, year = {2026}, howpublished = {\url{https://abracalc.com/de/hex-in-hsl/}} }

Hat dieses Tool deine Frage beantwortet?

So verwendest du dieses Tool

  1. Geben Sie einen 6-stelligen Hex-Farbcode ein (z. B. #ff5733). Ein führendes # ist optional.
  2. Das Tool rechnet ihn in HSL um: Farbton in Grad, Sättigung und Helligkeit in Prozent.
  3. Kopieren Sie die hsl()-Zeichenfolge in Ihr CSS oder Stylesheet.

Fügen Sie einen Hex-Farbcode ein und erhalten Sie den entsprechenden HSL-Wert für CSS-hsl()-Funktionen oder Design-Tools.

Formel

Expand a 3-digit hex to 6 digits if needed (e.g. #abc → #aabbcc), then parse each pair: r = parseInt(hex[0..1], 16) / 255, similarly for g and b.

Then apply RGB-to-HSL: L = (max + min) / 2; S = d / (2 − max − min) if L > 0.5, else S = d / (max + min); hue from the dominant channel as in RGB-to-HSL.

Häufige Fragen

Warum Hex in HSL umrechnen?
HSL ist einfacher zu handhaben, wenn Sie Helligkeit oder Sättigung anpassen. Sie können den Farbton fixieren und Sättigung/Helligkeit anpassen, um Tints und Shades zu erzeugen.
Unterstützt das 3-stelliges Hex?
Ja, #abc wird als #aabbcc behandelt.

Quellen und Verweise