Was ist RGB-zu-HSL-Konverter?
Ein RGB-zu-HSL-Konverter macht aus Rot/Grün/Blau-Kanälen (0-255) Farbton, Sättigung und Helligkeit - das Modell, das CSS in hsl() nutzt - und wieder zurück. Der kostenlose RGB-zu-HSL-Konverter von ToolsMinify ist bidirektional: Bearbeiten Sie RGB oder HSL, sehen Sie die Live-Swatch und kopieren Sie rgb(), hsl() oder HEX. Er läuft im Browser, ohne Anmeldung oder Upload.
Wandeln Sie RGB in HSL und HSL in RGB sofort um. Kostenloser Online-Farbkonverter mit Live-Swatch und kopierfertigem rgb()- und hsl()-CSS.
Jetzt ausprobieren
Öffnen Sie den kostenlosen RGB-zu-HSL-Konverter und folgen Sie den Schritten unten - kein Download nötig.
Warum RGB-zu-HSL-Konverter nutzen?
- RGB ↔ HSL beim Tippen, mit Live-Swatch
- Kopierfertiges rgb()- und hsl()-CSS plus HEX
- Nativer Color Picker und Preset-Swatches
- Farbton 0-360, Sättigung und Helligkeit 0-100%
- 100% clientseitig - Farben verlassen den Browser nicht
So verwenden Sie RGB-zu-HSL-Konverter - Schritt für Schritt
- Schritt 1: Geben Sie R, G und B von 0 bis 255 ein - oder wählen Sie eine Farbe mit dem nativen Picker.
- Schritt 2: Lesen Sie die passenden H-, S- und L-Werte (Farbton 0-360, Sättigung und Helligkeit 0-100%).
- Schritt 3: Ändern Sie H, S oder L für die Gegenrichtung; RGB und die Swatch aktualisieren sich sofort.
- Schritt 4: Kopieren Sie rgb()- oder hsl()-CSS (oder HEX) in Ihr Stylesheet - ohne Anmeldung.
Der RGB-zu-HSL-Konverter befindet sich unter Konverter-Tools. Öffnen Sie die Tool-Seite, geben Sie Ihre Eingabe im Hauptfeld ein, und die Ergebnisse aktualisieren sich sofort. Nutzen Sie den Kopieren-Button, um die Ausgabe in Dokumente, Code-Editoren oder Tabellen einzufügen.
Häufige Anwendungsfälle
CSS-hsl() aus einem Design-RGB
Fügen Sie R, G und B aus Figma oder einem Screenshot ein und kopieren Sie hsl() für moderne Stylesheets.
Farbton ändern ohne RGB neu zu bauen
Halten Sie Sättigung und Helligkeit fest, drehen Sie den Farbton und kopieren Sie das neue rgb() für eine Palettenvariante.
Übergabe zwischen HEX- und HSL-Tools
Nutzen Sie den HEX-zu-RGB-Konverter für einen #rrggbb-Code, dann diesen Konverter für den HSL-Weg.
Farbmodelle erklären
Zeigen Sie, warum Grau den Farbton 0 hat, warum 50% Helligkeit ein reiner Ton ist und wie 100% Helligkeit Weiß wird.
Beispiele
- Reines Rot: rgb(255, 0, 0) → hsl(0, 100%, 50%).
- Tailwind-Blau 500: rgb(59, 130, 246) → hsl(217, 91%, 60%).
- Neutrales Grau: rgb(128, 128, 128) → hsl(0, 0%, 50%). Der Farbton ist 0, weil Grau keine Sättigung hat.
- HSL zu RGB: hsl(120, 100%, 50%) → rgb(0, 255, 0) (reines Grün).
Profi-Tipps
- Farbton 0 = Rot, 120 = Grün, 240 = Blau. 360 wickelt zurück auf 0.
- Bei 0% Sättigung ist die Farbe grau und der Farbton wirkt erst, wenn Sie S erhöhen.
- Helligkeit 0% ist Schwarz, 100% ist Weiß, 50% ist der 'reine' Ton bei voller Sättigung.
- RGB außerhalb des Bereichs wird auf 0-255 begrenzt; S und L auf 0-100.
- Brauchen Sie HEX, CMYK, Kontrast oder eine Tint-Shade-Rampe? Öffnen Sie den HEX-zu-RGB-Konverter.
Häufig gestellte Fragen
Wie wandle ich RGB in HSL um?
Geben Sie Rot, Grün und Blau von 0 bis 255 ein. Das Tool berechnet Farbton (0-360), Sättigung (0-100%) und Helligkeit (0-100%) und zeigt kopierbares hsl()-CSS. Beispiel: rgb(255, 0, 0) ist hsl(0, 100%, 50%).
Kann ich HSL in RGB umwandeln?
Ja. Ändern Sie H, S oder L und die RGB-Kanäle, rgb()-CSS, HEX und Swatch aktualisieren sich gemeinsam. Der Farbton wickelt bei 360; Sättigung und Helligkeit werden auf 0-100 begrenzt.
Was bedeuten H, S und L?
Farbton ist der Winkel auf dem Rad (0 Rot, 120 Grün, 240 Blau). Sättigung ist, wie kräftig die Farbe ist (0% Grau, 100% Vollfarbe). Helligkeit ist, wie hell sie ist (0% Schwarz, 50% rein, 100% Weiß).
Warum ist der Farbton bei Grau 0?
Grau hat 0% Sättigung, daher ist der Farbton undefiniert und dieser Konverter meldet 0. Eine Änderung des Farbtons an Grau wirkt erst, wenn Sie die Sättigung erhöhen.
Ist das dasselbe wie HEX zu RGB?
Nein. Der HEX-zu-RGB-Konverter ist für #rgb / #rrggbb-Codes, plus CMYK, Kontrast und Tokens. Dieses Tool ist der bidirektionale RGB-↔-HSL-Weg. Kombinieren Sie beide, wenn eine Spec HEX und HSL mischt.
Verlässt meine Farbe das Gerät?
Nein. Der RGB-zu-HSL-Konverter läuft vollständig in Ihrem Browser. Werte werden nicht hochgeladen oder auf einem Server gespeichert.
Verwandte Tools, die Sie brauchen könnten
Entdecken Sie weitere konverter-tools auf ToolsMinify. Verwandte Utilities sind auf der Seite von RGB-zu-HSL-Konverter verlinkt, damit Sie Ihren Workflow ohne Seitenwechsel abschließen können.
Bereit zum Start?
Nutzen Sie den RGB-zu-HSL-Konverter kostenlos - genau, schnell und für Mobilgeräte optimiert.