How to Convert a HEX Color to RGB (and Back)
HEX and RGB are just two ways of writing the same color. Converting between them is handy for CSS, design tools and APIs — here's how the notation works and how to convert in one click.
Last updated: July 2026
A HEX color like #3B82F6 encodes red, green and blue as three pairs of hexadecimal digits: 3B = 59 red, 82 = 130 green, F6 = 246 blue, giving rgb(59, 130, 246). To convert, paste the hex code into a color converter and it outputs the RGB (and HSL) equivalents instantly. Each pair ranges from 00 (0) to FF (255).
Convert colors between HEX, RGB and HSL, with a live colour picker and preview. Free, instant in-browser color converter.
Step by step
- Open the free Color Converter.
- Enter a HEX code like #3B82F6.
- Read the equivalent RGB and HSL values.
- Copy the format you need for your CSS or design tool.
How does hex map to RGB?
A six-digit hex color is three 2-digit hexadecimal numbers — red, green, blue — each from 00 to FF, i.e. 0 to 255. So #FF0000 is pure red rgb(255,0,0). A leading # is convention; the eight-digit form (#RRGGBBAA) adds an alpha channel.
When to use HEX, RGB or HSL
HEX is compact and common in CSS and design files. RGB is easy to compute with. HSL (hue, saturation, lightness) is the most intuitive for tweaking a color by hand — nudging lightness without touching the hue.
FAQ
Does it support alpha/transparency?
Yes — 8-digit hex (#RRGGBBAA) and rgba() include an alpha channel for transparency.
Is anything uploaded?
No — conversion is instant and entirely in your browser.
Related tools
CSS Gradient Generator
Create linear and radial CSS gradients visually and copy the code. Free, instant, in-browser gradient generator.
Image Color Picker
Pick colours from any image and extract its palette as HEX/RGB. Free, private, in-browser color picker — no upload.
CSS Box Shadow Generator
Design CSS box-shadows visually with sliders and copy the code. Free, instant, in-browser box-shadow generator.