Convert HEX, RGB and HSV into Studio-ready Color3.fromRGB and Color3.new
In Roblox every color is a Color3. Three constructors trip up beginners: Color3.fromRGB(r, g, b), which takes integers from 0 to 255, the same values you see in any color picker; Color3.new(r, g, b), which takes floats from 0 to 1, the engine's internal form; and Color3.fromHSV(h, s, v), which also takes floats from 0 to 1 on all three channels (hue is a fraction of 360 degrees, not the degree itself). Converting between them is direct: each channel of Color3.new is the 0–255 value divided by 255 (so 255 becomes 1.0, 128 becomes ~0.502 and 0 stays 0), and the same logic applies to the normalized HSV. This tool accepts any common format (HEX, rgb(), HSV or a Color3 you already wrote) and returns all the others, including all three constructors ready to paste. It also recognizes when the current color is an exact match for one of Studio's classic BrickColor palette colors and shows the matching BrickColor.new("Name"). So you can grab a color from Figma, a screenshot or a website and drop it straight into your script or a BackgroundColor3 property without doing the math by hand.
Color3 is Roblox's color data type and always stores three channels (red, green and blue) as floats from 0 to 1, that is the internal form. What changes is how you write it: Color3.fromRGB(r, g, b) takes the familiar integers from 0 to 255 and does the division for you; Color3.new(r, g, b) expects the already-normalized floats; Color3.fromHSV(h, s, v) also expects floats from 0 to 1 on all three channels, but describes the color by hue, saturation and value instead of red, green and blue. There is also Color3.fromHex("#RRGGBB"), which reads a hex directly in Studio.
The math is simple and lossless in practice: to normalize, divide each channel by 255; to go back, multiply by 255 and round. The tool does this both ways and also computes the HSV (hue, saturation and value), handy when you want to vary only the brightness or saturation of a color. The Color3.new values are rounded to three decimals, which keeps the number clean and faithful to the original color.
A vibrant orange in HEX #FF5900 becomes RGB(255, 89, 0). Dividing each channel by 255: 255/255 = 1, 89/255 ≈ 0.349 and 0/255 = 0. So Color3.fromRGB(255, 89, 0) and Color3.new(1, 0.349, 0) produce exactly the same color, the first is more readable in scripts, the second is what the engine stores internally.
Going the other way, paste a medium gray Color3.new(0.5, 0.5, 0.5): the tool multiplies each channel by 255 (0.5 × 255 = 127.5, rounded to 128) and returns RGB(128, 128, 128) and the HEX #808080. This shows why a "round" decimal like 0.5 does not always map to an exact integer, the rounding is imperceptible to the eye.
Color3 appears in nearly every color property: BackgroundColor3 and TextColor3 in the UI, a Part's Color, the color of a PointLight, a ParticleEmitter, a Highlight and so on. Writing fromRGB makes the script more readable for whoever reads it later, because the numbers match Studio's color picker and design tools.
When you want to generate variations, a lighter hover state, a darker shadow, HSV helps: keep the hue and change only the saturation or value (that is exactly what Color3.fromHSV takes). And if you come from old tutorials that use BrickColor, remember that BrickColor has a fixed, limited palette; converting to Color3 gives you access to any shade. When the color you paste matches one of those classic colors exactly, the tool also shows the matching BrickColor.new("Name"). To build whole palettes from a base color, see our Color Wheel too.
Paste the code into your HTML and the tool shows up on your page, without J-Kit's navigation and ads. It still runs in the browser of whoever visits your site.
<iframe
src="https://jkit.tools/embed/en-US/roblox-color-converter"
width="100%"
height="600"
style="border:0"
loading="lazy"
title="Roblox Color3 Converter"
></iframe>These references help contextualize formulas, standards, APIs and limitations used on this page. They do not replace professional validation when a result has legal, financial, medical or operational impact.
Color3.fromRGB takes integers from 0 to 255 (e.g. Color3.fromRGB(255, 89, 0)) and is the most intuitive way because it matches any color picker. Color3.new takes floats from 0 to 1 (e.g. Color3.new(1, 0.349, 0)) and is the engine's internal form. Both produce exactly the same color; use whichever you prefer, many pick fromRGB because it is more readable.
Color3.fromRGB(255, 89, 0)Color3.new(1, 0.349, 0)Color3.fromHSV(0.058, 1, 1)#FF5900rgb(255, 89, 0)21°, 100%, 100%Conversion runs locally in your browser; nothing is sent to any server.