🎨 Hex to RGB Converter

What is the Hex to RGB Converter?

Hex and RGB are two ways of writing the same color. RGB describes a color as three channels, red, green, and blue, each from 0 to 255. A hex code packs those same three numbers into six hexadecimal digits, two per channel, because base-16 needs exactly two digits to cover the range 0 to 255 (00 to FF). A hex to RGB converter simply reverses that packing: it splits the six digits into three pairs and reads each pair as a number from 0 to 255.

The conversion is exact and lossless in both directions, so #3B82F6 and rgb(59, 130, 246) are the same pixel color, just written differently. Designers tend to copy hex from tools like Figma or a brand style guide, while CSS, canvas, and many charting libraries expect rgb() or rgba() when you need transparency. That gap is why a fast hex to RGB converter is one of the most-used utilities in a front-end workflow: you paste the hex your design gives you and get the rgb() string your code wants.

This hex to RGB converter also handles the two things people trip over. First, #RGB shorthand: a three-digit code like #abc is expanded by doubling each digit to #aabbcc before parsing, so #abc becomes rgb(170, 187, 204), not a broken value. Second, case and the hash symbol are optional, so 3b82f6, #3B82F6, and 3B82F6 all resolve to the same RGB triple. Anything that is not 3 or 6 valid hex digits is rejected with a friendly message instead of a silent wrong answer.

Beyond RGB, the tool converts the same color to HSL (hue, saturation, lightness), which is often easier to reason about when you want a lighter or more muted variant. For #3B82F6 that is hsl(217, 91%, 60%): a blue hue at 217 degrees, high saturation, medium lightness. Having hex, RGB, RGBA, and HSL side by side lets you copy whichever format the current file needs without hunting through a separate hex to RGB converter for each one.

When to use it

• Turning a brand hex code from a style guide into the rgb() value your CSS or design token file expects.
• Building an rgba() color so you can add transparency (for example a 20 percent overlay) that plain hex cannot express in older code.
• Feeding exact 0 to 255 channel values into a canvas, SVG, or charting library that takes numeric RGB rather than a hex string.
• Checking that a shorthand code like #abc expands correctly to #aabbcc = rgb(170, 187, 204) before you commit it.

How to use the Hex to RGB Converter

1. Type or paste your hex color into the input. You can include the hash or not, use upper or lower case, and use #RGB shorthand or full #RRGGBB.
2. Read the parsed Red, Green, and Blue values (0 to 255) and check the live swatch matches the color you expected.
3. Copy the rgb(), rgba(), or hsl() string you need with the Copy button next to each one.
4. Adjust the color with the built-in picker if you want to nudge it, then copy the updated values.

Formula & method

Worked examples

Common hex codes and their RGB values

Single hex digit to decimal value

Common mistakes to avoid

• Reading each hex pair as base 10. F6 is not 76 in the usual sense. Each pair is base 16, so F6 = 15x16 + 6 = 246. A good hex to RGB converter does this base conversion for you so you never have to do the arithmetic by hand.
• Not expanding #RGB shorthand. Shorthand like #abc means #aabbcc, not #ab0c00 or #0a0b0c. Each of the three digits is doubled before parsing, so #abc is rgb(170, 187, 204).
• Assuming hex can carry transparency. A 6-digit hex code only holds red, green, and blue. To add opacity you either use an 8-digit hex (RRGGBBAA) or convert to rgba(), for example rgba(59, 130, 246, 0.5) for 50 percent.
• Confusing hex order with RGB order. Hex is written RRGGBB, the same channel order as rgb(), so the first pair is always red. Do not reverse it. #FF8800 is rgb(255, 136, 0), an orange, not rgb(0, 136, 255).

Glossary

Hex color code

A color written as # followed by 3 or 6 hexadecimal digits, where each channel uses two digits from 00 to FF.

RGB

A color model that mixes Red, Green, and Blue light, each on a 0 to 255 scale, written as rgb(r, g, b).

RGBA

RGB plus an Alpha channel for opacity, from 0 (transparent) to 1 (opaque), written as rgba(r, g, b, a).

HSL

Hue (0 to 360 degrees), Saturation, and Lightness (both percentages). A more intuitive way to lighten or desaturate a color.

Hexadecimal

A base-16 number system using digits 0 to 9 and letters A to F, where A is 10 and F is 15.

#RGB shorthand

A 3-digit hex code where each digit is doubled to make the full 6-digit code, so #f0c becomes #ff00cc.

Frequently asked questions