HWB (Hue, Whiteness, Blackness) is acylindrical-coordinate representation of points in anRGB color model, similar toHSL and HSV. It was developed byHSV’s creatorAlvy Ray Smith in 1996 to address some of the issues with HSV. HWB was designed to be more intuitive for humans to use[1] and slightly faster to compute. The first coordinate, H (Hue), is the same as the Hue coordinate inHSL and HSV.W andB stand forWhiteness andBlackness respectively and range from 0–100% (or 0–1). The mental model is that the user can pick a main hue and then “mix” it with white and/or black to produce the desired color.[2]
HWB was included in theCSS Level 4 Color Module in 2014.[1]
HWB is very closely related toHSV, and therefore the conversion formulas are fairly simple.[2] Before conversion from HWB, if the sum of whiteness and blackness exceeds 100%, both components must be scaled back proportionally to make the sum 100%.
| HSV to HWB | HWB to HSV | RGB to HWB |
|---|---|---|
TheCSS Color Level 4 draft specification[1] includes a number of HWB example color swatches.[3]
B W | 0% | 20% | 40% | 60% | 80% | 100% |
|---|---|---|---|---|---|---|
| 0% | ||||||
| 20% | ||||||
| 40% | ||||||
| 60% | ||||||
| 80% | ||||||
| 100% |
B W | 0% | 20% | 40% | 60% | 80% | 100% |
|---|---|---|---|---|---|---|
| 0% | ||||||
| 20% | ||||||
| 40% | ||||||
| 60% | ||||||
| 80% | ||||||
| 100% |
B W | 0% | 20% | 40% | 60% | 80% | 100% |
|---|---|---|---|---|---|---|
| 0% | ||||||
| 20% | ||||||
| 40% | ||||||
| 60% | ||||||
| 80% | ||||||
| 100% |
B W | 0% | 20% | 40% | 60% | 80% | 100% |
|---|---|---|---|---|---|---|
| 0% | ||||||
| 20% | ||||||
| 40% | ||||||
| 60% | ||||||
| 80% | ||||||
| 100% |
B W | 0% | 20% | 40% | 60% | 80% | 100% |
|---|---|---|---|---|---|---|
| 0% | ||||||
| 20% | ||||||
| 40% | ||||||
| 60% | ||||||
| 80% | ||||||
| 100% |
B W | 0% | 20% | 40% | 60% | 80% | 100% |
|---|---|---|---|---|---|---|
| 0% | ||||||
| 20% | ||||||
| 40% | ||||||
| 60% | ||||||
| 80% | ||||||
| 100% |
B W | 0% | 20% | 40% | 60% | 80% | 100% |
|---|---|---|---|---|---|---|
| 0% | ||||||
| 20% | ||||||
| 40% | ||||||
| 60% | ||||||
| 80% | ||||||
| 100% |
B W | 0% | 20% | 40% | 60% | 80% | 100% |
|---|---|---|---|---|---|---|
| 0% | ||||||
| 20% | ||||||
| 40% | ||||||
| 60% | ||||||
| 80% | ||||||
| 100% |
B W | 0% | 20% | 40% | 60% | 80% | 100% |
|---|---|---|---|---|---|---|
| 0% | ||||||
| 20% | ||||||
| 40% | ||||||
| 60% | ||||||
| 80% | ||||||
| 100% |
B W | 0% | 20% | 40% | 60% | 80% | 100% |
|---|---|---|---|---|---|---|
| 0% | ||||||
| 20% | ||||||
| 40% | ||||||
| 60% | ||||||
| 80% | ||||||
| 100% |
B W | 0% | 20% | 40% | 60% | 80% | 100% |
|---|---|---|---|---|---|---|
| 0% | ||||||
| 20% | ||||||
| 40% | ||||||
| 60% | ||||||
| 80% | ||||||
| 100% |
B W | 0% | 20% | 40% | 60% | 80% | 100% |
|---|---|---|---|---|---|---|
| 0% | ||||||
| 20% | ||||||
| 40% | ||||||
| 60% | ||||||
| 80% | ||||||
| 100% |
| CAM | |
|---|---|
| CIE | |
| RGB | |
| Y′UV | |
| Other | |
| Color systems and standards | |
For the vision capacities of organisms or machines, see  Color vision. | |
 | This color-related article is astub. You can help Wikipedia byexpanding it. |