HSL to HSV (HSB) converter
Enter hue, saturation and lightness and get HSV values, the model behind the color pickers in Photoshop and Figma.
Loading the tool…
Processing and privacy: The result is calculated inside your browser and your data is not sent to any server.
How to use it
- Enter hue (h), saturation (s) and lightness (l).
- The result appears straight away and updates as you edit.
- Copy the result, or copy a link that keeps the same values to share it.
How it is calculated
Hue H is unchanged; with S and L as fractions, V = L + S × min(L, 1 - L) and HSV saturation = 2 × (1 - L / V), or 0 when V = 0.
Example
Inputs: Hue (H) = 200 °, Saturation (S) = 50 %, Lightness (L) = 40 %. Result: HSV code: hsv(200, 66.7%, 60%); Hue (H): 200 °; Saturation (S): 66.7 %.
Limits and caveats
- Values in the code are rounded to one decimal, so converting back can shift an RGB channel by 1.
- All values are treated as sRGB, the default web color space, not Display P3 or Adobe RGB.
Questions about this tool
Does the hue change from HSL to HSV?
No. H is the same in both models; only saturation changes, and value V takes the place of lightness L.
What does 50% lightness mean in HSL?
At 50% the color is at its most vivid for its saturation; moving toward 0% blends it into black and toward 100% into white.
Is HSV the same as HSB?
Yes. They are two names for one model; V (value) and B (brightness) mean the same thing, and Photoshop labels it HSB.