HSV-Werte in RGB umrechnen

Die erste Zahl ist der Farbton (H), ein Winkel auf dem Farbkreis: 0° ist Rot, 120° Grün und 240° Blau. Die zweite ist die Sättigung (S), bei der 0 % ein neutrales Grau und 100 % die reine Farbe bedeuten. Die dritte ist der Hellwert (V), auch Dunkelstufe genannt[1]. Photoshop nennt dasselbe Modell HSB, und die Adobe-Hilfe bezeichnet seine Bestandteile als Farbton, Sättigung und Helligkeit[2].

Sättigung und Hellwert versteht man am besten über Malfarbe. Alvy Ray Smith, der das Modell 1978 beschrieb, verglich sie mit dem Beimischen von Weiß und Schwarz zu einem reinen Farbton: weniger Sättigung heißt mehr Weiß, ein niedrigerer Hellwert heißt mehr Schwarz[3]. Deshalb ist jede Farbe mit Hellwert 0 % schwarz, egal was die beiden anderen Zahlen sagen, und bei Sättigung 0 % bleibt ein Grau mit diesem Hellwert.

Liegt Ihre Farbe in einer anderen Schreibweise vor, etwa als OKLCH, Lab oder Android-Code, zeigt der Farbumrechner sie gleichzeitig in allen Schreibweisen.

Berechnen Sie zuerst die Buntheit, also die Spanne zwischen den Kanälen: C = V × S. Teilen Sie dann den Farbton durch 60°. Der ganzzahlige Teil wählt einen von sechs Abschnitten des Farbkreises, aus dem Rest ergibt sich der mittlere Kanal: X = C × (1 − |(H ÷ 60°) mod 2 − 1|). Zum Schluss addieren Sie zu jedem Kanal m = V − C[4].

Nehmen wir hsv(217.2, 76%, 96.5%). Die Buntheit beträgt 0,965 × 0,76 = 0,733. Der Farbton geteilt durch 60° ergibt 3,62, die Farbe liegt also im Abschnitt zwischen 180° und 240°, in dem Rot null ist, Grün der mittlere Kanal und Blau voll. Der mittlere Kanal beträgt 0,733 × (1 − |1,62 − 1|) = 0,279, und m = 0,965 − 0,733 = 0,232.

Nach dem Addieren von m haben die Kanäle 0,232, 0,511 und 0,965. Mit 255 multipliziert und gerundet ergibt das rgb(59, 130, 246), und der RGB-in-HEX-Umrechner macht daraus einen Hexadezimalcode.

CSS kennt keine Funktion hsv(), wohl aber hwb(), in der nach dem Farbton die Menge an Weiß und Schwarz folgt, die der Farbe beigemischt wird[6]. Das HWB-Modell hat Alvy Ray Smith 1996 beschrieben, und es ergibt sich aus HSV über zwei kurze Formeln: W = (1 − S) × V und B = 1 − V[7].

Für hsv(217.2, 76%, 96.5%) beträgt der Weißanteil (1 − 0,76) × 0,965 = 23,1 % und der Schwarzanteil 1 − 0,965 = 3,5 %. Im Stylesheet schreiben Sie also hwb(217.2 23.1% 3.5%), und der Browser zeigt dieselbe Farbe wie rgb(59, 130, 246). Wenn Sie eine Schreibweise bevorzugen, die jedes Werkzeug versteht, fügen Sie einfach das Ergebnis dieses Umrechners ein.

OpenCV speichert den Farbton eines 8-Bit-Bildes als halben Winkel, damit er in ein Byte passt[8]. Benachbarte Farbtonwerte liegen deshalb 2° auseinander, und eine Farbe dazwischen hat keine genaue Entsprechung. Das Tripel 109, 194, 246, das OpenCV für rgb(59, 130, 246) liefert, kommt mit der OpenCV-Option als rgb(59, 127, 246) zurück, also mit einem um drei Stufen niedrigeren Grünkanal. OpenCV selbst liefert genau dasselbe: Wir haben die OpenCV-Option mit OpenCV.js 4.10 an allen Tripeln mit einem Farbton von 0 bis 180 verglichen.

Geht das Ergebnis zurück in ein Bild, das mit cv2.imread geladen wurde, nehmen Sie cv2.COLOR_HSV2BGR, denn ein solches Bild speichert die Kanäle in der Reihenfolge Blau, Grün, Rot[9].