Roblox stores colors as Color3 objects made of red, green, and blue floats between 0 and 1, and the engine's built-in Color3.fromHSV(hue, saturation, value) function is the standard way to convert HSV into that RGB triplet at runtime. The function expects hue in the 0–1 range (where 0 and 1 both wrap to red), saturation in the 0–1 range (0 is gray, 1 is fully saturated), and value in the 0–1 range (0 is black, 1 is full brightness). When you write Color3.fromHSV(0, 1, 1) you get pure red, which Roblox reports as (1, 0, 0). To use the more familiar 0–360 degree hue and 0–100 percent saturation and value notation that most color pickers and design tools emit, divide your degrees by 360 and your percentages by 100 before passing them to the constructor. Roblox also exposes Color3:ToHSV(), which performs the reverse mapping for verification. For checking that an HSV triple you plan to paste into a script produces the RGB you expect — or for breaking a known Color3 into hue, saturation, and value to study or share — a browser-based RGB to HSV Converter gives the same arithmetic in a copyable form.

how to convert hsv to rgb roblox
how to convert hsv to rgb roblox

Roblox Color3 and the HSV/RGB Workflow

Every Roblox part, GUI element, and Lighting property that exposes a color ultimately resolves to a Color3: three floating-point channels labeled R, G, and B, each clamped to the 0–1 range. That is why a slider in Studio's Properties window always shows values like 0.472 rather than 120, and why scripts frequently write Color3.fromRGB(120, 80, 40) with the integer form normalized internally. The HSV representation exists alongside Color3, not inside it. HSV reorganizes the same physical light into a hue (where on the wheel), saturation (how far from gray), and value (how bright the strongest channel is). Roblox exposes HSV through the constructor Color3.fromHSV and the method Color3:ToHSV, and many external color pickers, palette tools, and shader editors describe colors in HSV by default.

Because Roblox's constructor and your color picker speak slightly different dialects of HSV, the most common friction point is range. Roblox takes hue on a 0–1 circle where 0 and 1 are the same red anchor — a 360 degree wheel wrapped onto a unit interval. Saturation and value are also 0–1 fractions. Most design tools, however, describe hue as 0–360 degrees and saturation and value as 0–100 percent. Aligning those two dialects is the practical core of any HSV to RGB conversion in Roblox, and it is the reason a separate conversion or lookup tool is worth having while you develop.

Convert HSV to RGB with Color3.fromHSV

  1. Confirm your source values. Write down the hue in degrees (0–360) and the saturation and value as percentages (0–100). These are the units most external palettes and pickers return.
  2. Normalize each channel to Roblox's 0–1 range. Divide hue by 360, saturation by 100, and value by 100. The three resulting floats are what Color3.fromHSV expects.
  3. Call Color3.fromHSV(h, s, v) in a LocalScript, ServerScript, or the command bar. The returned Color3 holds the red, green, and blue channels as 0–1 floats, matching what every Roblox property expects.
  4. Assign the result to the property you are styling. Common targets include Part.Color, Frame.BackgroundColor3, TextLabel.TextColor3, and lighting properties such as Lighting.Ambient and Lighting.FogColor.
  5. Read back the channels with Color3:ToHSV() if you want to confirm the round trip. The method returns the same normalized 0–1 form, which you can multiply back to degrees and percent for display.

The constructor does not clamp out-of-range inputs the way many color libraries do. A saturation above 1 will over-saturate the result without raising an error, and a hue above 1 will simply wrap once through the wheel. Normalizing up front keeps the resulting Color3 inside the canonical 0–1 channels that Studio expects and avoids subtle color shifts that come from silent wrapping.

Look Up HSV from a Roblox Color3

Sometimes you already have a Color3 — maybe a color you sampled from a part, a brand color copied from a design spec, or a hex code you converted to RGB — and you need to know what HSV it represents so you can tweak it in a slider. That is the reverse direction, and it is where the RGB to HSV Converter tool fits into the workflow. Open it in your browser, enter whole-number red, green, and blue values from 0 through 255, and click Convert to HSV. The tool returns the hue on a 0–360 degree circle, the saturation as a percentage, the value as a percentage, the normalized HSV notation, and the source hex. The interface keeps the three RGB inputs visible so you can nudge one channel and watch how all three HSV components respond — useful when iterating on a Roblox color without re-entering the values in Studio each time.

The converter follows the standard Android Color contract for HSV ranges, where hue is at least zero and below 360 degrees and saturation and value live in the zero-to-one range before being shown as percentages (per the Android Developers documentation on Color). If you have the Roblox Color3 form, multiply each 0–1 channel by 255 and round to whole numbers before typing them in. The displayed saturation and value can be read straight back into Roblox's 0–1 form by dividing by 100. The displayed hue needs the same 360→1 division step as in the constructor path.

Worked Example: From a Roblox Color to Both Systems

Take the warm orange you might pick for a sunset skybox: Color3.fromRGB(200, 100, 50), which Roblox stores internally as R = 0.784, G = 0.392, B = 0.196.

Converting that Color3 to HSV using the standard max-channel piecewise formula gives:

  • Maximum channel: R = 0.784, minimum = B = 0.196, delta = 0.588.
  • Value (V): max(R, G, B) = 0.784, displayed as 78.43%.
  • Saturation (S): delta ÷ max = 0.588 ÷ 0.784 = 0.7500, displayed as 75.00%.
  • Hue (H): because R is the maximum, H = 60 × ((G − B) ÷ delta) = 60 × ((0.392 − 0.196) ÷ 0.588) = 60 × 0.3333 = 20.00°.

To put those numbers back into a script, divide by the unit ranges: 20 ÷ 360 ≈ 0.0556, 75 ÷ 100 = 0.75, 78.43 ÷ 100 ≈ 0.7843. The Roblox call Color3.fromHSV(0.0556, 0.75, 0.7843) reconstructs the same orange, and Color3:ToHSV() round-trips back to 0.0556, 0.75, 0.7843.

HSV Channel Ranges and the Color Wheel

The 0–360 degree hue circle is divided into six anchor positions that line up with the additive primaries and secondaries. The table below maps each wheel anchor to its degree value, its Roblox-normalized 0–1 form, and the saturated RGB the constructor returns at full saturation and value.

ColorHue (degrees)Hue (0–1)Saturated RGB at V = 1
Red00.000(1, 0, 0)
Yellow600.167(1, 1, 0)
Green1200.333(0, 1, 0)
Cyan1800.500(0, 1, 1)
Blue2400.667(0, 0, 1)
Magenta3000.833(1, 0, 1)

Remember that HSV value tracks the strongest channel rather than perceived lightness. A pure yellow at (1, 1, 0) and a pure blue at (0, 0, 1) both have value 1 even though one reads as much brighter on screen than the other. If your goal is a perceptually balanced gradient, an HSL construction or a color picker that exposes perceived lightness will give more even steps.

Common Pitfalls When Converting HSV to RGB in Roblox

Forgetting the 360→1 and 100→1 rescale. The single most common bug is feeding Roblox a hue of 120 thinking it will produce green when it actually lands partway between cyan and blue. Always divide degrees by 360 and percentages by 100 immediately after copying values from a design tool.

Assuming HSV value equals HSL lightness. HSV value is the largest normalized channel. HSL lightness is the average of the largest and smallest channels. A pale yellow and a pale blue have identical HSL lightness values but very different HSV values. If your code, shader, or animation keyframes were built around HSL, switching to HSV without rebalancing will skew the brightest frames.

Treating equal RGB as a normal hue. When R, G, and B are equal — including pure black, pure white, and middle gray — saturation is zero and the hue has no visual meaning. Roblox still returns a number from Color3:ToHSV(), conventionally 0, but shifting it will not change the rendered color. An achromatic check (max channel equals min channel) is the safest guard before treating the hue as meaningful.

Trusting a third-party HSV lookup blindly. Not every online HSV tool follows the same convention. Some store hue as 0–179 or 0–255 integers for compact image processing, and some report saturation as a percentage while others report it as a 0–1 fraction. The RGB to HSV Converter used here is independently checked against the R grDevices rgb2hsv convention (see the R grDevices rgb2hsv documentation) and displays hue in degrees with saturation and value as percentages, which matches the most common design-tool dialect and is one division away from Roblox's 0–1 form.