Hex to RGB for Game Developers: Unity, Unreal, and Web

Every game engine handles colors differently. Unity uses normalized float values (0.0 to 1.0). Unreal uses FColor and FLinearColor structs. Web-based games use either CSS color strings or raw integer channels depending on the rendering library. The hex converter above gives you the base RGB values, then the code patterns below show how to use them in each engine.

Unity: Two Ways to Use Hex Colors

Unity's Color type uses floats from 0.0 to 1.0, not integers from 0 to 255. You have two approaches:

Option 1: ColorUtility (recommended)

Color myColor;
ColorUtility.TryParseHtmlString("#3B82F6", out myColor);
renderer.material.color = myColor;

ColorUtility handles the conversion and accepts the # prefix. It works in the Unity editor and at runtime.

Option 2: Divide by 255

// #3B82F6 = rgb(59, 130, 246)
Color myColor = new Color(59f/255f, 130f/255f, 246f/255f);

This is the manual approach — useful when you already have the RGB integers and want to build the Color struct directly.

Unreal Engine: FColor and FLinearColor

Unreal has two color types. FColor stores 8-bit integer channels (0-255). FLinearColor stores float channels for HDR and gamma-correct workflows.

// FColor from hex string
FColor MyColor = FColor::FromHex(TEXT("3B82F6"));

// FLinearColor from hex (with gamma correction)
FLinearColor MyLinear = FLinearColor::FromSRGBColor(FColor::FromHex(TEXT("3B82F6")));

Note that FColor::FromHex() does not include the # prefix. Use the RGB values from the converter if you are building FColor manually: FColor(59, 130, 246).

Sell Custom Apparel — We Handle Printing & Free Shipping

Web Games: Canvas 2D and WebGL

Canvas 2D accepts CSS color strings directly — hex codes work without any conversion:

ctx.fillStyle = "#3B82F6";
ctx.fillRect(0, 0, 100, 100);

WebGL requires normalized float values from 0.0 to 1.0, similar to Unity:

// #3B82F6 = rgb(59, 130, 246)
gl.clearColor(59/255, 130/255, 246/255, 1.0);

Libraries like Three.js accept hex directly with the 0x prefix: new THREE.Color(0x3B82F6). Phaser.js accepts both hex strings and hex integers.

Godot and Other Engines

Godot uses the Color class with a hex() constructor:

var my_color = Color("3b82f6")  # GDScript, no # prefix
var my_color = Color.html("#3b82f6")  # also valid

For raw RGB integers from the converter, Godot also accepts normalized values: Color(59.0/255, 130.0/255, 246.0/255).

Most engines that do not have a built-in hex parser use the same pattern: divide each channel by 255 to normalize, then pass the float values to the engine color constructor.

Frequently Asked Questions

Why does Unity use 0 to 1 instead of 0 to 255 for colors?

Normalized float values (0.0 to 1.0) map more naturally to shader math and GPU rendering pipelines. Dividing by 255 to normalize is a one-time conversion that happens at load or initialization time, not every frame.

Can I use hex colors directly in Unity material properties?

Yes, via ColorUtility.TryParseHtmlString(). It is the cleanest approach for converting hex in Unity code without manual arithmetic. The Color output can then be assigned to any material color property.

What is the difference between FColor and FLinearColor in Unreal?

FColor stores gamma-encoded sRGB values (0-255 integers). FLinearColor stores linear light values (0.0-1.0 floats) for accurate HDR and physically based rendering. For UI and simple materials, FColor is usually fine. For lighting and PBR shaders, use FLinearColor.

Does Three.js accept hex strings like #3B82F6?

Three.js Color accepts hex as an integer with the 0x prefix (0x3B82F6) or as a CSS string ("3B82F6" or "#3B82F6"). All three forms produce the same result.