araç köşesi

RGB-in-HSV-Umrechner

Rechnen Sie eine RGB- oder HEX-Farbe in Farbton, Sättigung und Hellwert (HSV/HSB) um — oder geben Sie HSV ein und erhalten Sie RGB und HEX

Ihre Daten bleiben bei Ihnen. Die Umwandlung läuft im Browser; nichts wird an einen Server gesendet.

So funktioniert es

Schreiben Sie eine Farbe pro Zeile; eine Richtung müssen Sie nicht wählen, das Werkzeug erkennt die Schreibweise. rgb(154, 52, 18), die bloße Zahlenfolge "154 52 18" und ein HEX-Code wie #9A3412 werden als RGB gelesen und in HSV umgerechnet: Dieses Ziegelrot ergibt hsv(15, 88%, 60%) — Farbton 15 Grad, Sättigung 88 Prozent, Hellwert 60 Prozent. In der Gegenrichtung liefert hsv(145, 70%, 55%) den Wert rgb(42, 140, 83) und das Grün #2A8C53. Der Farbwähler von Photoshop zeigt dieselben Zahlen unter dem Namen HSB; hsb(15, 88, 60) und "H15 S88 B60" werden deshalb ebenfalls angenommen. Achten Sie auf einen Punkt: Drei Zahlen ohne Präfix und ohne Zeichen gelten immer als RGB. "24 88 60" ergibt ein dunkles Grün in RGB; wenn Sie HSV meinen, schreiben Sie hsv(24, 88%, 60%) oder 24° 88% 60%. Arbeiten Sie in Python mit OpenCV, wählen Sie als Ausgabe die OpenCV-Skala; die Werte erscheinen dann in den Bereichen 0-179 und 0-255, die diese Bibliothek erwartet. Nicht lesbare Zeilen werden markiert, die übrigen Zeilen werden trotzdem umgerechnet.

Dieses Werkzeug ist auch als rgb in hsv umrechnen, hsv in rgb umrechnen, rgb in hsv, hex in hsv umrechnen, hsv farbwerte, hsb farbwerte umrechnen bekannt.

Was ist HSV (HSB)?

HSV beschreibt eine Farbe mit drei Angaben: Der Farbton (Hue) gibt die Lage auf dem Farbkreis in Grad an, die Sättigung (Saturation), wie kräftig oder vergraut die Farbe ist, und der Hellwert (Value), wie hell sie ist. Farbton 0 ist Rot, 120 Grün und 240 Blau; bei Sättigung null wird die Farbe grau, bei Hellwert null schwarz. Photoshop zeigt dasselbe Modell als HSB. Es wird aus RGB berechnet — kein neuer Farbraum, sondern eine Schreibweise von RGB, die dem menschlichen Sprechen über Farbe folgt.

Was ist Farbtonwinkel?

Der Farbton ist die Stelle der Farbe auf dem Farbkreis und wird in Grad angegeben: 0 Rot, 60 Gelb, 120 Grün, 180 Cyan, 240 Blau, 300 Magenta; 360 Grad führt wieder zu Rot, deshalb gibt das Werkzeug für 360 den Wert 0 aus. Grautöne, Weiß und Schwarz haben keinen Farbton; die Formel setzt ihn dann auf 0. Ob zwei Farben zur selben Familie gehören, erkennen Sie am Farbtonwinkel, während ihre RGB-Zahlen völlig unverbunden aussehen können.

Was ist RGB?

RGB schreibt das rote, grüne und blaue Licht jedes Bildpunkts als drei Zahlen von 0 bis 255 und ist die einzige Sprache, die Browser, Smartphones und Monitore direkt verstehen. Weil die Zahlen der Hardware folgen, müssen Sie in RGB alle drei gleichzeitig ändern, um eine Farbe etwas heller oder blasser zu machen. Die Umrechnung in HSV verkleinert diese Anpassung auf eine einzige Zahl; der angepasste Wert wird danach wieder in RGB oder HEX für den Bildschirm umgerechnet.

Was ist der Unterschied zwischen HSV und HSL?

Beide schreiben den Farbton auf derselben Gradskala; sie unterscheiden sich im dritten Wert. In HSV liegt die reinste Form einer Farbe bei Hellwert 100 Prozent und Sättigung 100 Prozent, Weiß entsteht mit Sättigung 0 und Hellwert 100. In HSL liegt die reine Farbe bei Helligkeit (Lightness) 50 Prozent, und Helligkeit 100 ist unabhängig vom Farbton Weiß. Deshalb hat dieselbe Farbe in beiden Modellen eine andere Sättigungszahl. CSS versteht hsl(), aber nicht hsv(); die Farbwähler in Gestaltungsprogrammen nutzen dagegen meist HSV/HSB. Brauchen Sie HSL, rechnet der Farbcode-Umrechner dieser Website HEX in HSL um.

Warum zeigt jedes Programm andere HSV-Zahlen für dieselbe Farbe?

Für HSV gibt es eine Formel, aber keine einheitliche Schreibweise; jedes Programm verteilt das Ergebnis auf seine eigene Skala. Photoshop und GIMP zeigen den Farbton in Grad von 0 bis 360, Sättigung und Hellwert in Prozent von 0 bis 100 — diese Skala verwendet auch dieses Werkzeug. Das Python-Modul colorsys liefert alle drei Werte als Bruch zwischen 0 und 1. OpenCV halbiert den Farbton für 8-Bit-Bilder auf 0 bis 179 und streckt Sättigung und Hellwert auf 0-255. Der HSV-Modus von Pillow hält alle drei Kanäle im Bereich 0-255.

Prüfen Sie also vor dem Einfügen eines HSV-Werts aus Beispielcode oder einer Anleitung, in welcher Skala er geschrieben ist. Gelb, in OpenCV als (30, 255, 255) notiert, entspricht hsv(60, 100%, 100%) in Grad und Prozent; tippen Sie die OpenCV-Zahlen direkt in dieses Feld, entsteht eine falsche Farbe. Die OpenCV-Skala wird nur als Ausgabe angeboten und kann von der Ganzzahlrechnung in OpenCV um eine Einheit abweichen.

Wofür HSV taugt — und wofür nicht

HSV zerlegt eine Farbe so, wie Menschen über sie sprechen: welche Farbe (Farbton), wie kräftig (Sättigung), wie hell (Hellwert). Für hellere und dunklere Abstufungen einer Hausfarbe behalten Sie den Farbton und verändern nur den Hellwert; die Farbfamilie bleibt erhalten. In der Bildverarbeitung wird eine bestimmte Farbe — ein Greenscreen, ein rotes Verkehrsschild — über einen HSV-Bereich ausgewählt statt über RGB, weil sich der Farbton bei Licht und Schatten kaum ändert.

CSS kennt allerdings keine Funktion hsv(); auf einer Webseite schreiben Sie Farben als HEX, rgb() oder hsl(). Deshalb gibt dieses Werkzeug neben jedem HSV-Wert auch HEX und RGB aus: Sie finden die Farbe im Farbwähler und übernehmen den HEX-Code in Ihr Stylesheet.

  • Farbwähler in Photoshop/GIMP, Gestaltungsdateien → HSV/HSB (Grad und Prozent)
  • Website, CSS, Präsentation → HEX oder rgb()
  • Farbmasken mit Python + OpenCV → OpenCV-Skala (0-179, 0-255)

Häufige Fragen

Wie rechne ich RGB in HSV um?

Schreiben Sie die Farbe als rgb(154, 52, 18) oder einfach "154 52 18" in eine Zeile; das Ergebnis erscheint als hsv(15, 88%, 60%) mit Farbfeld. Haben Sie einen HEX-Code (#9A3412), fügen Sie ihn direkt ein.

Ist HSV dasselbe wie HSB?

Ja. Hellwert (Value, V) und Helligkeit (Brightness, B) bezeichnen dieselbe Zahl; Photoshop nennt das Modell HSB, viele andere Programme HSV. Dieses Werkzeug liest auch hsb(…) und "H15 S88 B60" als HSV.

Warum gehen die Farbtonwerte in OpenCV nicht über 180?

OpenCV speichert jeden Kanal eines 8-Bit-Bildes im Bereich 0-255. Ein Farbton von 360 Grad passt nicht hinein und wird deshalb auf 0-179 halbiert, Sättigung und Hellwert werden auf 0-255 skaliert. Wählen Sie die OpenCV-Skala als Ausgabeformat, erscheinen die Werte in diesen Bereichen.

Ich habe drei Zahlen eingegeben und eine falsche Farbe erhalten — warum?

Drei Zahlen ohne Präfix und ohne Zeichen werden als RGB gelesen. Für HSV schreiben Sie hsv(24, 88%, 60%) oder setzen Grad- und Prozentzeichen; dann behandelt das Werkzeug die Zeile als HSV.