Alle Tools

HSL-zu-RGB-Farbumrechner

Geben Sie Farbton (0-360 Grad), Sattigung und Helligkeit (in Prozent) ein, und dieses Tool wandelt Ihre Farbe in das RGB-Format um (0-255 Rot, Grun, Blau). Ideal, um eine in CSS definierte HSL-Farbe in Bildbearbeitungsprogrammen oder anderen Tools weiterzuverwenden.

HSL-zu-RGB-Farbumrechner
FORMULA ENGINE
Ergebnisse
Live-Vorschauhsl(210, 65%, 45%)
Rot (R)40
Grun (G)115
Blau (B)189

Die R-, G-, B-Werte im Ergebnis zeigen die Intensitaten der Rot-, Grun- und Blaukanale auf einer Skala von 0 bis 255. Sie konnen diese Werte direkt in CSS als rgb(R, G, B) oder in Bildbearbeitungssoftware verwenden.

Wie ist das Ergebnis zu interpretieren?

Die R-, G-, B-Werte im Ergebnis zeigen die Intensitaten der Rot-, Grun- und Blaukanale auf einer Skala von 0 bis 255. Sie konnen diese Werte direkt in CSS als rgb(R, G, B) oder in Bildbearbeitungssoftware verwenden.

Wie wird HSL in RGB umgerechnet?

Zunachst wird aus Sattigung und Helligkeit ein 'Chroma'-Wert (C) berechnet. Je nachdem, in welches 60-Grad-Segment der Farbton fallt, werden R-, G-, B-Kanalen vorlaufige Werte zugewiesen; schliesslich wird ein Helligkeitsausgleich (m) hinzugefugt und das Ergebnis auf den Bereich 0-255 skaliert.

Formel

  • Sattigung und Helligkeit werden von Prozent in einen Bereich von 0 bis 1 umgerechnet.
  • Ein 'Chroma'-Wert (C) wird unabhangig vom Helligkeitsausgleich (m) berechnet.
  • Es wird bestimmt, in welches 60-Grad-Segment der Farbtonwert fallt.
  • Entsprechend diesem Segment werden den R-, G-, B-Kanalen vorlaufige Werte (eine Kombination aus C, X, 0) zugewiesen.
  • Der Helligkeitsausgleich (m) wird addiert, und das Ergebnis wird mit 255 multipliziert, um die endgultigen R-, G-, B-Werte zu erhalten.

Beispiel fur HSL-zu-RGB-Umrechnung

H=210°, S=65%, L=45% (ein kraftiges Blau) entspricht etwa R=40, G=115, B=189.

Tipps zur HSL-zu-RGB-Umrechnung

  • Geben Sie den Farbton (H) zwischen 0 und 360 Grad ein; 360 Grad entspricht derselben Farbe wie 0 Grad (Rot).
  • Geben Sie Sattigung und Helligkeit in Prozent (0-100) ein; Dezimalwerte liefern ein genaueres Ergebnis.
  • Die resultierenden RGB-Werte konnen Dezimalzahlen sein; runden Sie sie fur die Verwendung am Bildschirm oder in CSS auf die nachste ganze Zahl.

Vergleiche

HSL(0°, 100%, 50%)

RGB(255, 0, 0)

Reines Rot; der Ausgangspunkt des Farbkreises.

HSL(120°, 100%, 50%)

RGB(0, 255, 0)

Reines Grun; 120 Grad auf dem Farbkreis.

HSL(240°, 100%, 50%)

RGB(0, 0, 255)

Reines Blau; 240 Grad auf dem Farbkreis.

HSL(0°, 0%, 50%)

etwa RGB(128, 128, 128)

Neutrales Grau; der Farbton ist visuell bedeutungslos, sobald die Sattigung null ist.

Leitfaden zur HSL-zu-RGB-Farbumrechnung

Das HSL-Modell (Hue, Saturation, Lightness) ist eines der Formate, die Designer am haufigsten zum Definieren einer Farbe verwenden, da die unabhangige Anpassung von Farbton, Sattigung und Helligkeit das Erstellen von Farbvarianten erleichtert. Da Bildschirme und die meisten Bildformate Farbe jedoch als RGB verarbeiten, muss eine in HSL definierte Farbe erst in RGB umgewandelt werden, bevor sie angezeigt werden kann.

Diese Umrechnung beruht darauf, zu bestimmen, in welches 60-Grad-Segment des Farbkreises der Farbton (H) fallt; der Kreis ist in sechs gleiche 60-Grad-Segmente unterteilt, und in jedem wird eine andere Kombination der Rot-, Grun- und Blaukanale dominant.

Sattigung und Helligkeit bestimmen, wie 'breit' (Chroma, C) die Kanalwerte innerhalb dieses Segments ausfallen. Hohe Sattigung erzeugt lebendigere Farben, niedrige Sattigung erzeugt gedecktere, grauahnliche Farben, und die Helligkeit verschiebt das Ergebnis in Richtung Schwarz oder Weiss.

Dieses Tool verarbeitet die von Ihnen eingegebenen H-, S-, L-Werte gemass den Standard-Umrechnungsschritten und erzeugt direkt verwendbare R-, G-, B-Werte. Sie konnen die Ergebnisse in der CSS-Funktion rgb(), in Bildbearbeitungssoftware oder in anderen farbbasierten Tools verwenden.

Die Umrechnung von HSL in RGB ist besonders nutzlich fur Entwickler, die mit HSL definierte Markenfarben aus einem Designsystem an Drittanbieter-Tools ubergeben mussen — etwa altere Bildbearbeitungsprogramme oder Drucksoftware —, die eine RGB- oder HEX-Eingabe erwarten.

FAQ

Was ist HSL?

HSL ist ein Farbmodell, das eine Farbe mit drei Komponenten beschreibt: Farbton, Sattigung und Helligkeit.

Was ist RGB?

RGB ist ein Farbmodell, das Bildschirmfarben durch Kombination von rotem, grunem und blauem Lichtanteil erzeugt, jeweils im Bereich von 0 bis 255.

Warum HSL in RGB umwandeln?

Diese Umrechnung ist notig, um eine mit HSL in CSS oder einem Design-Tool definierte Farbe in Bildbearbeitungsprogrammen oder anderen RGB-basierten Systemen zu verwenden.

Was passiert, wenn der Farbtonwert (H) 360 uberschreitet?

Da sich der Farbton um den Farbkreis dreht, steht 360 Grad fur dieselbe Farbe wie 0 Grad (Rot); dieses Tool erwartet einen Wert zwischen 0 und 360.

Was ist das Ergebnis, wenn die Sattigung (S) 0% betragt?

Wenn die Sattigung 0% betragt, hat der Farbtonwert keine Wirkung mehr, und das Ergebnis ist ein Grauton (R=G=B), der nur von der Helligkeit abhangt.

Ergibt 50% Helligkeit mit 100% Sattigung die lebendigste Farbe?

Ja, bei 50% Helligkeit kombiniert mit 100% Sattigung erreicht eine Farbe ihren lebendigsten (am starksten gesattigten) Zustand; diese Kombination ist typisch fur reine Farben wie Rot, Grun und Blau.

Warum kommen die resultierenden RGB-Werte als Dezimalzahlen heraus?

Die HSL-zu-RGB-Umrechnungsformel ist mathematisch, daher ist das Ergebnis nicht immer eine ganze Zahl; Anzeigesysteme runden diese Werte in der Regel auf die nachste ganze Zahl.

Welche Farbformate unterstutzt dieses Tool?

Dieses Tool wandelt eine HSL-Eingabe (Farbton, Sattigung, Helligkeit) in eine RGB-Ausgabe (Rot, Grun, Blau) um, die Sie in Bildbearbeitungsprogrammen oder der CSS-Funktion rgb() verwenden konnen.

Ähnliche Tools

Dieses Tool einbetten

<iframe src="https://pinfox.tech/de/tools/allgemein/hsl-rgb-umrechner/?embed=1" width="100%" height="720" loading="lazy" style="border:0;border-radius:12px;overflow:hidden" title="HSL-zu-RGB-Farbumrechner - Pinfox"></iframe>