How to Convert HWB to HEX
Converting HWB (Hue, Whiteness, Blackness) to a HEX code translates a color format designed for human intuition into the standard machine-readable format used across the web.
Understanding the Formats
HWB was created to make picking colors feel like mixing physical paint. You start with a base Hue on a 360-degree wheel, then add white to create a tint or black to create a shade. HEX, on the other hand, tells a monitor exactly how much red, green, and blue light to emit using base-16 math.
The Conversion Path
There is no direct mathematical formula to jump straight from HWB to HEX. The color must first be converted into standard RGB values.
- Check for Gray: If the Whiteness and Blackness percentages add up to 100% or more, the hue is completely washed out. The resulting color is a shade of gray determined by the ratio of white to black.
- Calculate RGB: If the color isn't purely gray, the algorithm calculates a base RGB value from the Hue, then scales those channels down based on the amount of black, and shifts them up based on the amount of white.
- Convert to Base-16: Once you have the final Red, Green, and Blue decimal values (ranging from 0 to 255), each channel is converted into a two-digit hexadecimal string and combined with a
#prefix.
Handling Transparency
If your HWB value includes an alpha channel (for example, hwb(204deg 20% 14% / 50%)), the resulting HEX code will be eight characters long. The alpha percentage is converted to a 0-255 scale and appended to the end of the HEX string.