About the HSV to RGB Converter
Many design apps and colour pickers show colours as HSB or HSV: a hue angle, a saturation percentage and a brightness or value percentage. Websites, CSS and most code need RGB or hex instead. This converter takes hue (0–360°), saturation (0–100%) and value (0–100%) and gives the matching RGB values from 0 to 255, the hex code and a live swatch, so you can move a colour from a design tool into code without guessing.
Updated October 2026
How to use the HSV to RGB Converter
- 1Enter the hue in degrees, from 0 to 360.
- 2Enter the saturation as a percentage.
- 3Enter the value (brightness) as a percentage.
- 4Read the RGB result and the hex code.
- 5Copy whichever you need.
From a design app to code
Colour pickers in Photoshop, Affinity, Figma and Procreate let you read a colour as HSB. Copy those three numbers here to get the RGB and hex values your stylesheet, app or game engine needs. The swatch lets you check that it is the colour you expected before you paste it.
Understanding the three numbers
Hue picks the colour on the wheel. Saturation decides how much of that colour there is compared with grey. Value sets how bright the strongest channel is, from black at 0% to full brightness at 100%.
- hsv(120, 100%, 100%) = rgb(0, 255, 0), bright green
- hsv(210, 50%, 80%) = rgb(102, 153, 204), soft blue
- hsv(45, 90%, 95%) = rgb(242, 188, 24), warm yellow
- hsv(0, 0%, 25%) = rgb(64, 64, 64), dark grey
Making a palette
Keep the hue fixed and change the other two numbers to build a set of shades that belong together: lower the value for darker variants and lower the saturation for softer ones. Convert each to RGB or hex here and you have a consistent palette for buttons, backgrounds and borders.
Rounding
RGB channels are whole numbers, so the result is rounded. Two HSV values that differ by a fraction of a percent may give the same RGB colour, which is expected.
Common mistakes
Some apps show saturation and value from 0 to 1 instead of 0 to 100; multiply those by 100 before typing them here. Others show hue from 0 to 1 or 0 to 255, so check the range in your app's colour picker. If the swatch looks completely wrong, the hue scale is the usual culprit.
Phone or computer
Use it on any screen. The result updates as you type, and nothing is stored or uploaded. HSV is handy for picking colours, while RGB is what screens use. Go back with the RGB to HSV Converter, compare another model with the HSL to RGB Converter, and write the result as a web code with the RGB to HEX Converter.
Features
- HSV / HSB to RGB
- Hex code shown with the result
- Live swatch
- Range checks with friendly messages
- Copy button
- Free, no sign-up
Frequently asked questions
How do I convert HSV to RGB?
Work out the chroma C = V × S, find where the hue falls in six 60° sectors, and add the base value V − C to each channel. Multiply by 255 for RGB. The converter does this exactly and rounds to whole numbers.
What is HSV 0, 100%, 100% in RGB?
Pure red: rgb(255, 0, 0), or #FF0000.
Is HSB the same as HSV?
Yes. Brightness (B) and value (V) mean the same thing, so you can enter HSB numbers from Photoshop, Figma or Procreate directly.
What happens if saturation is 0?
The colour is a grey whose level depends only on the value: hsv(any hue, 0%, 50%) is rgb(128, 128, 128).
Why is hue 360 the same as hue 0?
Hue is an angle around a circle, so 360° brings you back to red at 0°.
Can I convert to CSS?
Use the hex code or the rgb() text directly in CSS. CSS has no hsv() function, so converting is necessary.
Can I go back from RGB to HSV?
Yes. Our RGB to HSV converter does the reverse, which is handy for checking a colour you copied from a website.