Enter a RGB color below to get the exact HSV value instantly, plus every other format, right in your browser.
When you need RGB to HSV
RGB values come from camera frames, image files and CSS, but many tools treat color the way a painter does: pick a hue, then decide how vivid and how bright it is. That is what HSV, also called HSB, offers. Typical reasons to convert: typing a color into the HSB fields of a Photoshop or Figma picker, setting thresholds for color detection in an image-processing script, or choosing a base for generated color schemes. Enter the red, green and blue values to get hue, saturation and value.
Typical uses
- Setting color range thresholds for tracking a colored object in an OpenCV or similar vision script.
- Typing a sampled RGB color into the HSB fields of a Photoshop or Figma color picker.
- Checking what Unity's Color.RGBToHSV should return for a known color while debugging a shader or script.
How to convert RGB to HSV
HSV (also called HSB) shares its hue calculation with HSL but defines the other two axes differently: Value is simply the largest channel, V = max, and Saturation is S = Δ / max (0 for black).
That is why a fully saturated pure color has V = 100% in HSV but L = 50% in HSL. The reverse conversion rebuilds the channels from chroma C = V × S.
Worked example
- Normalize the channels: R′ = 142 ÷ 255 = 0.557, G′ = 68 ÷ 255 = 0.267, B′ = 173 ÷ 255 = 0.678
- max = 0.678 (B′), min = 0.267 (G′), Δ = 0.412
- V = max = 0.678 → 68%
- S = Δ ÷ max = 0.412 ÷ 0.678 = 0.607 → 61%
- H = 60 × ((R′ − G′) ÷ Δ + 4) = 60 × ((0.557 − 0.267) ÷ 0.412 + 4) ≈ 282°
rgb(142, 68, 173) = hsv(282, 61%, 68%)
Tip: For color detection in video, convert frames to HSV and threshold the hue first, then use looser limits for saturation and value. Red wraps around the hue circle, so a red range often needs two intervals: one near 0 and one near 360 (179 in OpenCV).
Common colors: RGB to HSV
| Color | RGB | HSV |
|---|---|---|
| Red | rgb(255, 0, 0) | hsv(0, 100%, 100%) |
| Orange | rgb(255, 165, 0) | hsv(39, 100%, 100%) |
| Yellow | rgb(255, 255, 0) | hsv(60, 100%, 100%) |
| Lime | rgb(0, 255, 0) | hsv(120, 100%, 100%) |
| Green | rgb(0, 128, 0) | hsv(120, 100%, 50%) |
| Cyan | rgb(0, 255, 255) | hsv(180, 100%, 100%) |
| Teal | rgb(0, 128, 128) | hsv(180, 100%, 50%) |
| Blue | rgb(0, 0, 255) | hsv(240, 100%, 100%) |
| Navy | rgb(0, 0, 128) | hsv(240, 100%, 50%) |
| Purple | rgb(128, 0, 128) | hsv(300, 100%, 50%) |
| Magenta | rgb(255, 0, 255) | hsv(300, 100%, 100%) |
| Pink | rgb(255, 192, 203) | hsv(350, 25%, 100%) |
| Brown | rgb(165, 42, 42) | hsv(0, 75%, 65%) |
| Gray | rgb(128, 128, 128) | hsv(0, 0%, 50%) |
| Black | rgb(0, 0, 0) | hsv(0, 0%, 0%) |
| White | rgb(255, 255, 255) | hsv(0, 0%, 100%) |
Frequently asked questions
Why does OpenCV show a different hue number than this page?
For 8-bit images OpenCV stores hue as 0-179, which is the 0-360 degree hue halved, and scales saturation and value to 0-255. Divide the hue from this page by 2 and multiply the percentages by 2.55 to match the OpenCV scale.
Is value the same as brightness in a picker?
In most pickers, yes: both name the largest of the red, green and blue channels, expressed as 0-100%. Brightness of 100% does not mean white. It only means that at least one channel is fully on.
What is the difference between HSV and HSL?
They share hue, but HSV's Value is the brightness of the strongest channel (a pure color has V = 100%), while HSL's Lightness places pure colors at 50%, halfway between black and white. Color pickers in design tools typically use HSV; CSS uses HSL.
Where is HSV used?
In the color pickers of graphics editors (Photoshop, GIMP, Figma) and in image processing and computer vision (e.g. OpenCV color thresholds), wherever separating chroma from brightness simplifies the task.
Is the conversion exact?
The formulas are mathematically exact, but displayed values are rounded to whole numbers, so converting back and forth can shift a channel by ±1. For pixel-perfect work keep the original value.
More color converters
Need to grab a color from an image or screenshot? Try the free Pixel Color Picker →