Hex to RGB
color converter

Q: How do I convert a hex code to RGB?

Type or paste the hex code (like #4F46E5) into the HEX field. The RGB values appear instantly and you can copy the full rgb(...) string with one click. Three-digit shorthand like #f80 works too.

Q: How do I convert RGB back to a hex code?

Enter your red, green, and blue values (each 0 to 255) in the RGB fields. The hex code updates as you type, ready to copy into CSS or a design tool.

Q: What is the difference between RGB and HSL?

RGB mixes red, green, and blue light to make a color. HSL describes the same color as hue, saturation, and lightness, so you can keep a hue and make it lighter or less vivid. Both point to the same color; they are just different ways to write it.

Q: Does it support 3-digit hex codes?

Yes. Short hex like #0af is automatically expanded to its full six-digit form (#00AAFF) before converting, so both formats work.

Convert HEX ⇄ RGB ⇄ HSL in one place. Type any code or pick a color, see it live, and copy the format you need in a click.

Live preview

📋 One-click copy

🚫 No upload

∞ Free

#4F46E5 rgb(79, 70, 229)

Pick a color, or type any code below

HEX

RGB

R G B

HSL

H° S% L%

About this tool

A free color converter that turns any HEX code into RGB and HSL — and back again. Everything runs in your browser, so it works offline and nothing about your palette leaves the page.

Who uses it?

Developers matching a design's HEX to CSS rgb() or hsl()
Designers tweaking lightness and saturation in HSL
Anyone copying a brand color between tools

The conversions

Hex, RGB & HSL, explained

Hex to RGB

A hex code like #4F46E5 is just three pairs of hexadecimal digits — red, green, and blue. Each pair is a value from 00 to FF (0–255 in decimal). To convert hex to RGB, split the code into those pairs and read each as a base-16 number: 4F → 79, 46 → 70, E5 → 229, giving rgb(79, 70, 229). The tool above does this the instant you type a valid hex.

RGB to Hex

Going the other way, each of the red, green, and blue channels (0–255) is written as a two-digit hex value and joined together. rgb(255, 77, 43) becomes FF, 4D, 2B → #FF4D2B. Values under 16 get a leading zero so every channel stays two digits.

Hex to HSL

HSL describes a color as hue (0–360° on the color wheel), saturation (how vivid, 0–100%), and lightness (0% black to 100% white). It's converted from RGB, so hex → HSL happens in two steps: hex to RGB, then RGB to HSL. HSL is handy when you want to keep a hue but make it lighter or more muted.

HSL to Hex

Adjust hue, saturation, and lightness to taste, and the converter turns your HSL values back into RGB and then a hex code you can drop straight into CSS or a design tool. Great for building tints and shades of one base color.

Common color codes

A quick reference of popular colors in all three formats. Click any color preset in the tool to load it.

Color	HEX	RGB	HSL
Black	#000000	rgb(0, 0, 0)	hsl(0, 0%, 0%)
White	#FFFFFF	rgb(255, 255, 255)	hsl(0, 0%, 100%)
Red	#FF0000	rgb(255, 0, 0)	hsl(0, 100%, 50%)
Green	#00FF00	rgb(0, 255, 0)	hsl(120, 100%, 50%)
Blue	#0000FF	rgb(0, 0, 255)	hsl(240, 100%, 50%)
Orange	#FF4D2B	rgb(255, 77, 43)	hsl(10, 100%, 58%)
Sky blue	#3B82F6	rgb(59, 130, 246)	hsl(217, 91%, 60%)
Emerald	#10B981	rgb(16, 185, 129)	hsl(160, 84%, 39%)

FAQ

Common questions

How do I convert a hex code to RGB?+

Type or paste the hex code (like #4F46E5) into the HEX field above. The RGB values appear instantly, and you can copy the full rgb(...) string with one click. Three-digit shorthand like #f80 works too.

How do I convert RGB back to a hex code?+

Enter your red, green, and blue values (each 0–255) in the RGB fields. The hex code updates as you type, ready to copy into CSS or a design tool.

What is the difference between RGB and HSL?+

RGB mixes red, green, and blue light to make a color — great for screens but hard to tweak by eye. HSL describes the same color as hue, saturation, and lightness, so you can keep a hue and simply make it lighter or less vivid. Both point to the exact same pixel; they're just different ways to write it.

Does it support 3-digit hex codes?+

Yes. Short hex like #0af is automatically expanded to its full six-digit form (#00AAFF) before converting, so both formats work.

Is the color converter free and private?+

Completely free, with no signup and no limits. Every conversion happens in your browser with JavaScript — nothing is sent to a server, so it even works offline once the page has loaded.

Why does my HSL show slightly rounded numbers?+

HSL values are rounded to whole numbers for readability, which is what CSS expects. Converting hex → HSL → hex can occasionally shift by one value because of that rounding, but the color you see in the preview is always exact.