HSB to HEX

Convert HSB / HSV values to HEX colors.

Presets:

Hue

186°

Saturation

100%

Brightness

100%

HEX Output

#00e5ff

HEX: #00E5FFRGB: rgb(0, 229, 255)HSB: hsb(186°, 100%, 100%)

From HSB to a Web Color

HSB/HSV is intuitive for picking colors — spin the hue, then dial in saturation and brightness. To use a color on the web it must be converted to RGB/HEX. This tool performs the standard HSV→RGB conversion and renders a live swatch as you adjust the sliders. Copy the HEX for your CSS. Everything is computed locally in your browser.

Built and maintained by Meet Shah · Last updated 18 July 2026

What this tool is used for

Converting a colour picked in a graphics application into hex for CSS.
Turning an HSB specification from a designer into a usable token.
Producing hex from a hue-based exploration.
Comparing an HSB value against an existing hex palette.
Getting a concrete value from a model that is easier to adjust by hand.

Frequently Asked Questions

What is the difference between HSB and HSL?: The third channel. In HSB, brightness 100% with saturation 100% is the pure vivid hue; in HSL, lightness 100% is always white and the vivid hue sits at 50%. So the same hue and saturation numbers mean different colours in the two models.
Is HSB the same as HSV?: Yes — brightness and value are two names for the same channel, and the models are identical. Photoshop and Figma say HSB; graphics literature and most code libraries say HSV.
Why do design tools prefer HSB?: Because it matches how a colour picker is drawn: a square of saturation against brightness beside a hue strip is exactly the HSB space. Picking a tint means moving in one direction and a shade in another, which HSL's combined lightness channel makes less direct.
Does CSS support HSB?: No — CSS has `hsl()` but never adopted `hsb()`, so a value taken from Photoshop or Figma must be converted before it reaches a stylesheet. That conversion is precisely where a colour drifts if someone reads the numbers across by hand.
What happens at zero saturation?: The hue becomes meaningless and the colour is a grey determined by brightness alone: 0% is black, 100% white. Tools still show a hue value in that state, and copying it can produce a surprising colour once saturation is raised again.
What happens at zero brightness?: Everything becomes `#000000` regardless of hue and saturation, so those two values are unrecoverable from the result. Converting back yields hue 0 and saturation 0 — information the hex form simply does not carry.

Common errors and gotchas

Confusing HSB with HSL, where the same numbers describe different colours.
Assuming CSS accepts HSB, which it does not — only HSL, HWB and the newer spaces.
Reading brightness as lightness, so 100% brightness is expected to be white when it is a full-saturation hue.
Assuming a hue is meaningful at zero saturation, where HSB reports it but it describes nothing.
Losing alpha, which HSB as usually quoted does not carry.