RGB to HSV is a coordinate transformation that takes three integer red, green, and blue channel values from 0 to 255 and returns a hue in degrees on a 0–360 circle plus saturation and value expressed as percentages. The conversion is purely arithmetic — it does not change the color, only the description — and it relies on three quantities derived from the input: the maximum normalized channel, the minimum normalized channel, and the difference between them. Value is set equal to the maximum channel, saturation is the channel range divided by the maximum (with a zero guard for black), and hue is computed by a piecewise formula keyed to which channel is largest. The Android Color documentation and the R grDevices rgb2hsv reference both describe the same algorithm, which is the convention used by most color pickers, CSS color editors, and graphics applications.
What RGB and HSV Actually Describe
RGB describes a color by additive red, green, and blue amounts. Each channel is an independent integer from 0 to 255, so the triplet is a point inside a 256-step cube. HSV reorganizes the same triplet around three properties that often feel more intuitive when adjusting color: a hue that points to a position on a color wheel, a saturation that controls how far the color sits from the gray axis, and a value that tracks the strongest channel.
The hue circle runs from 0 to 360 degrees with six canonical anchor points. Pure red sits at 0, yellow at 60, green at 120, cyan at 180, blue at 240, and magenta at 300. Pure colors at full brightness sit on the outside of the wheel; colors on the inside are mixtures of pure hue with gray. Saturation is the radial coordinate and value is the height, so HSV is often drawn as a cone or cylinder. For a printable wheel reference that pairs these angles with concrete RGB and HEX swatches, the RGB to HSV wheel chart maps each sector directly.
| Hue (degrees) | Wheel Position | Role |
|---|---|---|
| 0 | Red | Primary anchor |
| 60 | Yellow | Secondary anchor |
| 120 | Green | Primary anchor |
| 180 | Cyan | Secondary anchor |
| 240 | Blue | Primary anchor |
| 300 | Magenta | Secondary anchor |
These six positions are defined by the HSV convention itself rather than computed per color: between 0 and 60 the hue rotates through warm tones toward yellow, between 60 and 120 it passes through yellow-green, between 120 and 180 it moves through teal toward cyan, and so on around the circle. The single-channel maximum inside the piecewise formula changes exactly at these anchor points, which is why they double as natural sector boundaries.
The Conversion Formula Step by Step
The algorithm starts by dividing each integer channel by 255 to produce normalized values R', G', and B' in the 0–1 range. It then computes the maximum M = max(R', G', B'), the minimum m = min(R', G', B'), and the difference Δ = M − m.
- Value V = M. The strongest channel drives value, so a color with one dominant channel has high value regardless of the others.
- Saturation S = 0 when M = 0 (true black) and S = Δ / M otherwise. Saturation measures how much the channels spread relative to the brightest one.
- Hue H uses a piecewise formula based on which channel equals M. When R is max: H = 60 × ((G' − B') / Δ). When G is max: H = 60 × ((B' − R') / Δ + 2). When B is max: H = 60 × ((R' − G') / Δ + 4). Any negative result is wrapped by adding 360 so the final hue falls in [0, 360).
As a concrete example, the color RGB(200, 50, 80) normalizes to R' ≈ 0.7843, G' ≈ 0.1961, B' ≈ 0.3137. The maximum is 0.7843, the minimum is 0.1961, and Δ = 0.5882. V = 0.7843 (78.43%), S = 0.5882 / 0.7843 = 0.75 (75.00%), and because R is the maximum the hue is 60 × (0.1961 − 0.3137) / 0.5882 = 60 × (−0.2) = −12°. Wrapping yields 348°. The RGB to HSV Converter returns H = 348.00°, S = 75.00%, V = 78.43% for this input, and the source HEX code plus a live swatch confirm the result visually.
How to Convert RGB to HSV With the Tool
- Enter the red, green, and blue channels as whole numbers from 0 through 255 in the three input fields. Decimal values, negatives, blanks, or numbers above 255 produce an explicit error rather than a silent clamp.
- Select Convert to HSV. The calculation runs locally in the browser using full floating-point arithmetic; nothing is uploaded and no color history is saved between sessions.
- Read the result: hue in degrees (0–360), saturation as a percentage (0–100%), and value as a percentage (0–100%). The source HEX code, the normalized HSV notation, and a live color swatch appear alongside.
- Check the destination's expected scale before copying. CSS and most color pickers accept degrees and percentages, but some image-processing libraries expect hue on a 0–179 or 0–255 integer scale and saturation/value as 0–1 fractions.
- Adjust one channel at a time to see how the three HSV components respond. Because the inputs remain visible, you can compare results without retyping the triplet.
Reading the Output: Degrees, Percentages, and Scales
The tool displays hue on a 0–360 degree circle and shows saturation and value as percentages with two decimal places, matching the Android Color convention. Behind the display, the calculation keeps full floating-point precision until formatting, so the displayed percentages are rounded for readability rather than truncated. A saturation shown as 80.90% on this page is therefore 0.809 in a 0–1 API and would round to 206 in a compact 8-bit representation — they describe the same color, but the numbers are not interchangeable.
Other software stores the same components differently. Some image-processing libraries return hue on a 0–179 scale so the value fits a single 8-bit integer channel, and a few pack all three HSV components into a 0–255 integer range for compact storage. When transferring values between programs, confirm the destination's expected range first; the conversion math is the same, only the display format differs. For a deeper look at how alternate scales and clamps behave at the boundaries, the hue scales and edge cases guide walks through the typical mismatches.
Edge Cases: Achromatic Colors and the Placeholder Hue
When all three channels are equal — black, white, and every gray between — the difference Δ is zero and saturation is therefore zero. Hue, however, has no visual meaning on the gray axis because every direction on the color wheel collapses to the same achromatic point. Different libraries handle this differently: some leave hue undefined, others propagate the previous hue, and a few define it as zero. This tool follows the Android convention and reports the conventional placeholder hue of 0 degrees for any achromatic input.
For black specifically, both Δ and M are zero, so saturation is forced to zero before the division. The implementation guards against dividing by zero, which matters because a naive implementation returns NaN and silently poisons downstream calculations. The strict 0–255 whole-number boundary helps here too: a typo such as 12 instead of 120 is rejected as an explicit error rather than being silently clamped into a plausible but incorrect color, and a decimal entry like 123.4 is treated as invalid instead of being rounded down to 123.
HSV Value Is Not HSL Lightness
HSV value and HSL lightness are easy to confuse because both use a single-letter label for the brightness axis and both are expressed as percentages. They measure different quantities. HSV value is the maximum normalized channel, so a color like RGB(255, 0, 0) has V = 100% even though it is visually less luminous than RGB(255, 255, 255). HSL lightness averages the maximum and minimum channels, so pure red becomes L = 50% while white becomes L = 100%.
If the destination expects HSL, use a dedicated HSL converter instead of relabeling the HSV value component. The two spaces produce noticeably different numbers for most colors, and pasting an HSV value into an HSL field will give a wrong result even when the percentages look similar. The same caution applies when comparing HSV output to measured luminance — luminance is a perceptual quantity derived from channel weighting, not a maximum channel. Conversion alone also says nothing about whether a foreground and background pair remain readable; for accessible contrast decisions, test the actual pair with a contrast checker rather than inferring from HSV coordinates.