HEX to HSV (HSB) converter
Enter a HEX code, with or without the #, 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 hex code.
- 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
Each pair of HEX digits is read as a base-16 number: R = RR, G = GG, B = BB, from 0 to 255; a 3-digit code doubles each digit. Then (RGB kept unrounded): With max and min of R/255, G/255, B/255 and d = max - min: V = max, S = d / max (0 when max = 0), and H comes from the largest channel: 60 × ((G - B) / d mod 6), 60 × ((B - R) / d + 2) or 60 × ((R - G) / d + 4).
Example
Inputs: HEX code = #1E90FF. Result: HSV code: hsv(209.6, 88.2%, 100%); Hue (H): 209.6 °; Saturation (S): 88.2 %.
#1E90FF
hsv(209.6, 88.2%, 100%)
Limits and caveats
- Transparency (#RRGGBBAA or #RGBA) is not read; enter the 6 or 3 digit color part.
- 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
Why convert HEX to HSV?
It lets you enter a brand color in a picker that works in H, S and B, or change its brightness without touching the hue.
Does it accept 3-digit codes like #0AF?
Yes. A 3-digit code is expanded by doubling each digit, so #0AF becomes #00AAFF. The # is optional.
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.
