Guide

How to Convert HEX to RGB (With Color Examples)

A six-digit HEX color stores three numbers: red, green, and blue. Split #FF8800 into FF, 88, and 00, then convert each pair from hexadecimal to decimal. The result is rgb(255, 136, 0).

Split the code into three pairs

The usual six-digit format is #RRGGBB. The first pair controls red, the second green, and the third blue. Each channel ranges from 00 to FF, equivalent to decimal values from 0 to 255.

#000000 has all three channels at zero and represents black. #FFFFFF has all three at 255 and represents white. #FF0000 has only the red channel at its maximum. These examples make the pair order easy to remember.

Convert each pair by place value

Hexadecimal uses digits 0–9 and letters A–F, where A = 10 through F = 15. A two-digit pair has value 16 × first digit + second digit. FF = 16 × 15 + 15 = 255; 88 = 16 × 8 + 8 = 136.

For #336699: 33 = 51, 66 = 102, and 99 = 153. The equivalent is rgb(51, 102, 153). HEX and RGB are two ways to write the same sRGB color, rather than different colors.

Short HEX and transparency need care

CSS also allows three-digit shorthand. #F80 expands by repeating each digit to #FF8800, not by adding zeros. This converter expects six digits, so expand shorthand before entering it.

Eight-digit HEX adds an alpha channel for transparency, as in #FF880080. This tool does not convert that format or output alpha values. Use a six-digit color here and handle transparency separately in the destination application.

What the HSL result means

HSL describes the same color through hue, saturation, and lightness. Hue is an angle around a color wheel; saturation and lightness are percentages. For #FF0000, the result is hsl(0, 100%, 50%).

The converter rounds HSL values to whole numbers, so copying its HSL output can introduce a small rounding difference. A color preview is also not an accessibility test: readable text depends on the contrast between foreground and background together.

Convert a color from your project

Paste a six-digit HEX code in the HEX field or choose a color with the picker. RGB, HSL, and a CSS variable declaration update from that input. The RGB and HSL fields are results, not editable inputs for reverse conversion.

Use #336699 as a check: RGB should read rgb(51, 102, 153). Copy the format your design or stylesheet expects. If the RGB field shows a dash, check for missing digits or characters outside 0–9 and A–F.

Try it yourself

Put this guide into practice with our free Color Converter — no sign-up, no download.

Open the Color Converter