This content has been automatically translated from Ukrainian.
If you need to convert RGB to HWB, you can use a formula that allows you to obtain hue (H), whiteness (W), and blackness (B).
Previously, we considered the reverse conversion: How to convert HWB to RGB?.
RGB Format
Colors in RGB format consist of three components:
- R (Red) — from 0 to 255
- G (Green) — from 0 to 255
- B (Blue) — from 0 to 255
How to Convert RGB to HWB Manually
- Find the hue (H) using the RGB → HSL conversion.
- Calculate whiteness (W) and blackness (B).
JavaScript Code Example
function rgbToHwb(r, g, b) {
r /= 255; g /= 255; b /= 255;
let max = Math.max(r, g, b);
let min = Math.min(r, g, b);
let w = min;
let bComp = 1 - max;
let h = (max === min) ? 0 :
(max === r) ? ((g - b) / (max - min)) * 60 + (g < b ? 360 : 0) :
(max === g) ? ((b - r) / (max - min)) * 60 + 120 :
((r - g) / (max - min)) * 60 + 240;
return [Math.round(h), Math.round(w * 100), Math.round(bComp * 100)];
}
console.log(rgbToHwb(51, 102, 255));