utilduck
Home · Entwickler · Farbkonverter

Farbkonverter

Geben Sie einen HEX-Farbcode ein, um RGB und HSL mit Vorschau sofort zu sehen.

Farbvorschau
RGB
-
HSL-
HEX-Farbe-

Über Farbformate

Farben auf Bildschirmen werden üblicherweise in drei Formaten ausgedrückt. HEX verwendet einen sechsstelligen Hexadezimalcode wie #4f46e5. RGB (Rot, Grün, Blau) beschreibt dieselbe Farbe als drei Zahlen von 0 bis 255. HSL (Farbton, Sättigung, Helligkeit) drückt Farbe durch ihren Winkel im Farbkreis (0-360°), Reinheit (0-100%) und Helligkeit (0-100%) aus. Alle drei sind ineinander umrechenbar.

Wie rechne ich HEX in RGB und HSL um?

Um eine HEX-Farbe in RGB umzuwandeln, teilen Sie sie in drei 2-stellige Paare und wandeln jedes von hexadezimal in dezimal (0-255) um; für HSL berechnen Sie Farbton, Sättigung und Helligkeit aus diesen RGB-Werten. Beispiel: #4F46E5 wird zu rgb(79, 70, 229) und hsl(243, 75%, 59%).

Schritte zur Umwandlung von HEX in RGB und HSL

  1. Entfernen Sie das #-Zeichen und teilen Sie den 6-stelligen HEX-Code in drei 2-stellige Paare (bei #4F46E5: 4F, 46, E5).
  2. Wandeln Sie jedes Hexadezimalpaar in eine Dezimalzahl von 0 bis 255 um (4F=79, 46=70, E5=229), um die RGB-Werte zu erhalten.
  3. Teilen Sie jeden RGB-Wert durch 255, um ihn auf den Bereich 0-1 zu normieren, und bestimmen Sie dann Maximum und Minimum der drei Werte.
  4. Die Helligkeit ist der Mittelwert aus Maximum und Minimum; Sättigung und Farbton werden aus der Differenz von Maximum und Minimum nach den Standard-HSL-Formeln berechnet.
  5. Runden Sie den Farbton auf ganze Grad (0-360) sowie Sättigung und Helligkeit auf ganze Prozentwerte (0-100 %) für die Anzeige.

HEX zu RGB zu HSL

RGB-Kanal = parseInt(Hex-Paar, 16) · Helligkeit = (max(R,G,B) + min(R,G,B)) / 2, normiert auf 0-1
  • R, G, B = Rot-, Grün-, Blau-Kanalwerte, jeweils 0-255
  • H, S, L = Farbton in Grad (0-360), Sättigung und Helligkeit in Prozent (0-100 %)

Häufig gesuchte Farbumrechnungen

Was ist #FF0000 in RGB?

#FF0000 ist rgb(255, 0, 0) — reines Rot, mit dem Rotkanal auf dem Maximum und Grün sowie Blau auf null.

Was ist #FFFFFF in RGB?

#FFFFFF ist rgb(255, 255, 255) — reines Weiß, mit allen drei Kanälen auf dem Maximum.

Was ist #000000 in RGB?

#000000 ist rgb(0, 0, 0) — reines Schwarz, mit allen drei Kanälen bei null.

Was ist rgb(0, 128, 0) als Hex-Code?

rgb(0, 128, 0) ist #008000 — ein mittleres Grün, da 128 dezimal gleich 80 hexadezimal ist.

Was ist #FFA500 in RGB?

#FFA500 ist rgb(255, 165, 0) — Standard-Orange.

Was ist #00FF00 in RGB?

#00FF00 ist rgb(0, 255, 0) — reines Grün, mit nur dem Grünkanal auf dem Maximum.

Was ist #0000FF in RGB?

#0000FF ist rgb(0, 0, 255) — reines Blau, mit nur dem Blaukanal auf dem Maximum.

Was ist rgb(255, 255, 0) als Hex-Code?

rgb(255, 255, 0) ist #FFFF00 — reines Gelb, gemischt aus vollem Rot und vollem Grün.

Beispielhafte Farbumwandlungen

HEXRGBHSL
#4F46E5rgb(79, 70, 229)hsl(243, 75%, 59%)
#FF0000rgb(255, 0, 0)hsl(0, 100%, 50%)
#00FF00rgb(0, 255, 0)hsl(120, 100%, 50%)
#1D4ED8rgb(29, 78, 216)hsl(224, 76%, 48%)
#FFFFFFrgb(255, 255, 255)hsl(0, 0%, 100%)

Häufig gestellte Fragen

Was ist der Unterschied zwischen HEX, RGB und HSL?

HEX und RGB beschreiben eine Farbe auf dieselbe Weise, als Rot-, Grün- und Blau-Lichtanteile, nur in unterschiedlicher Notation (Basis 16 gegenüber Basis 10). HSL beschreibt dieselbe Farbe über Farbton (die Farbe selbst), Sättigung (Intensität) und Helligkeit (wie hell oder dunkel), was sich beim manuellen Anpassen einer Farbe oft intuitiver anfühlt.

Warum zeigt Weiß 0 % Sättigung an?

Die Sättigung misst, wie weit eine Farbe von Grau entfernt ist. Reines Weiß, Schwarz und jede Graustufe dazwischen haben gleiche Rot-, Grün- und Blau-Werte, daher liegt ihre Sättigung immer bei 0 %, unabhängig von der Helligkeit.

Kann ich einen 3-stelligen HEX-Code wie #FFF eingeben?

Dieses Werkzeug erwartet das vollständige 6-stellige HEX-Format (#RRGGBB). Eine 3-stellige Kurzform wie #FFF ist CSS-Kurzschreibweise für #FFFFFF, bei der jede Ziffer verdoppelt wird; erweitern Sie sie vor der Eingabe auf 6 Stellen.

Wie wird der Farbton berechnet, wenn Rot, Grün und Blau alle unterschiedlich sind?

Der Farbton hängt davon ab, welcher Kanal — Rot, Grün oder Blau — den höchsten Wert hat, und wird aus der relativen Position der beiden anderen Kanäle berechnet. Das Ergebnis ist ein Winkel auf einem 360-Grad-Farbkreis, wobei 0 Grad Rot, 120 Grün und 240 Blau entspricht.

Dieses Werkzeug wandelt Standard-6-stellige HEX-Farben um, wie sie im Web verwendet werden; es unterstützt keine Alpha-(Transparenz-)Kanäle, benannte CSS-Farben oder Farbräume jenseits von sRGB wie HSV oder LAB.

Sources: W3C CSS Color Module Level 4

Datenschutz und Sicherheit

  • Läuft im Browser — Ihre Eingaben werden ausschließlich auf Ihrem Gerät berechnet und nicht an einen utilduck-Server gesendet.
  • Verschlüsselte Verbindung — Alle Seiten werden über HTTPS ausgeliefert, sodass niemand im Netzwerk mitlesen kann.
  • Keine Weitergabe an Dritte — Ihre Eingaben werden nicht an Analyse- oder Werbedienste weitergegeben.
  • Keine Speicherung — Ergebnisse werden auf keinem Server gespeichert, und ein Konto ist nicht nötig.

Zuletzt aktualisiert: 2026-08-24