EN
JavaScript - convert HSV color to RGB color
7 points
In this short article, we would like to show how to convert HSV color to RGB color using JavaScript.
Practical example:
xxxxxxxxxx
1
// Converts HSV color to RGB.
2
// Arguments:
3
// hue from 0 to 360 degree
4
// saturation from 0 to 1
5
// value from 0 to 1
6
// Returns: RGB color (components from 0 to 1)
7
//
8
const toRgb = (hue, saturation, value) => {
9
let d = 0.0166666666666666 * hue;
10
let c = value * saturation;
11
let x = c - c * Math.abs(d % 2.0 - 1.0);
12
let m = value - c;
13
c += m;
14
x += m;
15
switch (d >>> 0) {
16
case 0: return {red: c, green: x, blue: m};
17
case 1: return {red: x, green: c, blue: m};
18
case 2: return {red: m, green: c, blue: x};
19
case 3: return {red: m, green: x, blue: c};
20
case 4: return {red: x, green: m, blue: c};
21
}
22
return {red: c, green: m, blue: x};
23
};
24
25
26
// Usage example:
27
28
const rgb = toRgb(200, 0.5, 0.5); // 200deg, 50%, 50%
29
30
console.log(`red: ${Math.round(255 * rgb.red )}`); // 64
31
console.log(`green: ${Math.round(255 * rgb.green)}`); // 106
32
console.log(`blue: ${Math.round(255 * rgb.blue )}`); // 128