pluri.tools
🇩🇪
🇬🇧 English 🇧🇷 Português 🇪🇸 Español 🇫🇷 Français 🇩🇪 Deutsch 🇮🇹 Italiano 🇯🇵 日本語 🇳🇱 Nederlands 🇵🇱 Polski 🇹🇷 Türkçe 🇸🇪 Svenska 🇳🇴 Norsk 🇩🇰 Dansk

HEX zu HSL Konverter

HEX → RGBHEX → HSLRGB → HEXRGB → HSLHSL → HEXHSL → RGB
HEX
Eingabe
HSL
Ergebnis
H
S%
L%
RGB
R
G
B
↔ HSL zu HEX Konverter

Was ist HEX zu HSL Konverter

Dieses Tool konvertiert HEX-Farbcodes (wie #3B82F6) in HSL-Werte (wie hsl(217, 91%, 60%)). HSL steht für Farbton, Sättigung und Helligkeit — ein intuitiveres Farbmodell für Designer. Die Helligkeit in HSL anzupassen ist viel einfacher als in HEX oder RGB, ideal für die Erstellung von Farbpaletten und CSS-Custom-Properties.

Verwendung

  1. Tippe oder füge einen HEX-Farbcode in das HEX-Feld ein (mit oder ohne #).
  2. HSL- und RGB-Werte erscheinen sofort.
  3. Klicke auf den Kopieren-Button neben HSL, um im Format hsl(h, s%, l%) zu kopieren.
  4. Wechsle zwischen allen 6 Konvertern über die Modus-Links oben.

Wann ist es nützlich?

Du baust ein Farbsystem aus einer Markenfarbe auf? Füge die Marken-HEX (#E63946) ein und erhalte hsl(356, 75%, 56%). Von dort erstellst du hellere Töne, indem du die Helligkeit erhöhst, und dunklere, indem du sie senkst, immer im selben Farbton.

Häufig gestellte Fragen

Was ist HSL und warum statt HEX verwenden?

HSL (Hue/Farbton, Saturation/Sättigung, Lightness/Helligkeit) beschreibt Farben intuitiv. Farbton ist die Position auf dem Farbrad (0–360°), Sättigung die Intensität (0–100%) und Helligkeit die Leuchtkraft (0–100%). Farbvariationen in HSL zu erstellen ist viel einfacher als in HEX.

Was ist #FF0000 in HSL?

Reines Rot #FF0000 ist hsl(0, 100%, 50%). Farbton 0° ist Rot auf dem Farbrad, 100% Sättigung bedeutet voll gesättigt, 50% Helligkeit ist die Reinfarbe.

Unterstützt CSS HSL-Farben?

Ja. Modernes CSS unterstützt vollständig `hsl()` und `hsla()`. Zum Beispiel: `color: hsl(217, 91%, 60%);` und `background: hsla(217, 91%, 60%, 0.5);`

Was ist #000000 in HSL?

Schwarz (#000000) ist hsl(0, 0%, 0%). Helligkeit von 0% bedeutet reines Schwarz, unabhängig von Farbton oder Sättigung.

Kann ich dieses Tool mit vorausgefüllten Eingaben teilen?

Ja. Die URL aktualisiert sich während du tippst. Kopiere den Link aus der Adressleiste oder klicke auf Teilen — wer den Link öffnet, sieht deine Eingaben bereits ausgefüllt.

Ähnliche Werkzeuge

HSL zu HEX Konverter

Konvertiere HSL-Farbwerte sofort in HEX-Codes. Kostenloser HSL zu HEX Konverter mit Live-Vorschau. Wandle hsl()-Werte für CSS in HEX-Codes um.

Seitenverhältnis-Rechner

Berechne das Seitenverhältnis, finde die fehlende Breite oder Höhe und skaliere Bilder und Videos unter Beibehaltung der Proportionen. Kostenlos.

Base64-Decoder

Dekodiere Base64-Strings sofort zu Klartext im Browser. Unterstützt vollständige Unicode-Ausgabe mit Emojis. Kostenloser Base64-Decoder.