Text & Code / MULTIVERTO

HSL-Farbe in RGB

Wandeln Sie Farbton, Sättigung und Helligkeit in ganzzahlige RGB-Kanäle um.

Sofort umrechnenIhre Eingabe bleibt im Browser. Text wird für die Umrechnung nicht hochgeladen.
Die Datei bleibt in Ihrem Browser.
Werkzeuge verketten

Jedes Textwerkzeug auf das vorherige Ergebnis anwenden.

01 / Anleitung

So funktioniert es

Der Farbton wählt einen Sektor; Chroma und Helligkeit ergeben gerundete RGB-Kanäle.

Gut zu wissen

Das Ergebnis enthält keinen Alphakanal; verwendet werden ganzzahliges RGB und übliches HSL, keine Farbmanagementprofile.

02 / Beispiel

Beispiel

Ihre Eingabehsl(210, 70%, 50%)
Ergebnisrgb(38, 128, 217)

03 / Anleitung

HSL-Farbe in RGB — So funktioniert es

Aus HSL Kanäle bilden

Wandeln Sie Farbton, Sättigung und Helligkeit in ganzzahlige RGB-Kanäle um. Verwenden Sie diese Richtung, wenn ein Farbentwurf mit Farbton und zwei Prozentwerten beginnt, eine andere Anwendung aber Zahlen für RGB-Kanäle verlangt. Geben Sie hsl(210, 70%, 50%) oder dieselben kommaseparierten Werte ein. Der Farbton reicht von null bis 360 Grad, Sättigung und Helligkeit jeweils von null bis hundert Prozent.

Der Farbton wählt einen Sektor; Chroma und Helligkeit ergeben gerundete RGB-Kanäle. Der Algorithmus berechnet Chroma aus Sättigung und Helligkeit, setzt es in den Farbtonsektor und addiert einen gemeinsamen Versatz zu Rot, Grün und Blau. Danach rundet er Kanäle auf ganze Zahlen von null bis 255. Ein Farbton von 360 Grad entspricht null. Bei Sättigung null entsteht unabhängig vom Farbton Grau. Zur konkreten Prüfung ergibt die Beispieleingabe hsl(210, 70%, 50%) das Ergebnis rgb(38, 128, 217). Bewahren Sie die Quelle daneben auf, um sie mit einer anderen Anwendung zu vergleichen.

Die Farbmodelle verstehen

HEX und RGB beschreiben dieselben drei additiven Lichtkanäle. Jeder Kanal ist eine ganze Zahl zwischen null und 255; Hexadezimal schreibt diesen Wert mit zwei Ziffern zur Basis sechzehn. Ein sechsstelliger Code enthält daher in dieser Reihenfolge Paare für Rot, Grün und Blau. HSL beschreibt dieselbe RGB-Farbe anders: Der Farbton gibt einen Ort auf dem Farbkreis an, die Sättigung den Abstand zu einem Grau gleicher Helligkeit und die Helligkeit die Position zwischen Schwarz und Weiß. Diese Formen helfen beim Vergleichen von Designvariablen, beim Lesen von CSS und beim Abstimmen einer Palette.

Die passende Darstellung wählen

Das Ergebnis enthält keinen Alphakanal; verwendet werden ganzzahliges RGB und übliches HSL, keine Farbmanagementprofile. Wählen Sie die Form, die am Zielort erwartet wird. CSS versteht Hexadezimalwerte ebenso wie die Funktionen rgb() und hsl(); ein Designsystem oder Grafikprogramm speichert Kanäle aber vielleicht getrennt. Dieses Werkzeug verwendet gewöhnliche sRGB-Rechnung. Es wandelt keine Bildschirmprofile um und sagt nicht voraus, wie jeder Monitor die Farbe zeigt. Die Ausgaben mit drei Kanälen enthalten keine Transparenz. Für einen vier- oder achtstelligen Code mit Alpha ist eine andere Operation nötig. Ganzzahlige RGB-Kanäle und angezeigte HSL-Dezimalstellen werden gerundet; ein Hin- und Rückweg kann daher um einen Kanalwert abweichen.

So wird die Eingabe umgewandelt
HSL-Farbe
Farbkanäle
RGB-Farbe