About the HEX to RGB
The HEX to RGB Converter turns a color code like #FF5733 into its red, green and blue values. You get the CSS rgb() and rgba() forms, the bare numbers, percentages, values from 0 to 1 and the matching HSL, each with its own Copy button.
HEX is how colors are usually shared in design files and brand guides, but many places want RGB instead: CSS with transparency, Android and iOS code, game engines, charting libraries, email builders and spreadsheet formatting. This tool saves you from working out the base-16 math by hand.
It reads short codes (#F53), full codes (#FF5733) and codes with transparency (#FF573380), with or without the #. A list mode converts many colors at once. Everything runs in your browser.
How to use it
- Enter a HEX codeType or paste a code with 3, 4, 6 or 8 hex digits. The # is optional and upper or lower case both work.
- Or pick a colorUse the color box next to the field, or click one of the quick colors below it.
- Read the resultsThe preview shows the color, and the list shows RGB, RGBA, the bare values, percentages, 0 to 1 values and HSL.
- Copy the format you needEach row has a Copy button, so you can paste straight into CSS, code or a design app.
- Convert a listPaste one HEX code per line under "Convert a list" to get one rgb() or rgba() value per line.
Key features
All HEX lengths
3-digit shorthand, 4-digit shorthand with alpha, 6-digit and 8-digit with alpha, with or without #.
Six output formats
rgb(), rgba(), plain "R, G, B" numbers, percentages, values from 0 to 1, and HSL.
Transparency included
With 4 or 8 digits, the last part becomes the alpha value, shown in RGBA and in the 0 to 1 list.
List conversion
Converts many codes at once. Empty lines are skipped, and lines that are not valid HEX are marked "invalid:" instead of disappearing.
Clear error message
If the code has the wrong number of digits or a letter beyond F, the tool says so and clears the results, so you never copy a stale value.
Private by design
Nothing is sent anywhere. The conversion is simple math in your browser.
Examples
A full HEX code
The tool starts with #FF5733, a warm orange-red:
| Format | Result |
|---|---|
| RGB | rgb(255, 87, 51) |
| RGBA | rgba(255, 87, 51, 1) |
| R, G, B | 255, 87, 51 |
| Percent | rgb(100%, 34.1%, 20%) |
| 0 to 1 | 1.000, 0.341, 0.200 |
| HSL | hsl(11, 100%, 60%) |
How the math works
A HEX code is three pairs of base-16 digits: red, green and blue. Each pair is a number from 00 to FF, or 0 to 255. The digits A to F stand for 10 to 15, and the first digit of a pair counts sixteen times:
| Pair | Calculation | Value |
|---|---|---|
| FF (red) | 15 × 16 + 15 | 255 |
| 57 (green) | 5 × 16 + 7 | 87 |
| 33 (blue) | 3 × 16 + 3 | 51 |
The 0 to 1 values divide each number by 255, so 87 becomes 0.341. That is the form Swift, Unity, OpenGL and many other graphics tools use.
Shorthand and transparency
| HEX | RGBA |
|---|---|
#F53 | rgba(255, 85, 51, 1) |
#FF573380 | rgba(255, 87, 51, 0.502) |
#F538 | rgba(255, 85, 51, 0.533) |
In shorthand, every digit is doubled, so #F53 means #FF5533, which is close to but not the same as #FF5733. In 8-digit codes, the last pair is the opacity: 80 is 128 out of 255, or 0.502. A 4-digit code works the same way, with 8 standing for 88 (136 out of 255, or 0.533).
Converting a list
Paste these lines under "Convert a list":
#FF5733
2b59ff
#C6F24E80
#fff
blueThe result is rgb(255, 87, 51), rgb(43, 89, 255), rgba(198, 242, 78, 0.502), rgb(255, 255, 255) and invalid: blue. Color names are not HEX codes; the Color Picker reads those.
Tips
- Use rgba() when you need transparency in CSS that older tools must read. Modern CSS also accepts 8-digit HEX directly, such as #FF573380.
- When a mobile or game developer asks for "float" values, copy the 0 to 1 row. Each number is the RGB value divided by 255.
- Keep brand colors as 6-digit HEX in your style guide and convert when needed. Shorthand codes only exist for colors whose pairs repeat, like #FF5533.
- Convert a whole brand palette at once with the list mode, then paste the results into your stylesheet or design tokens.
- If you need to go the other way, the RGB to HEX converter turns rgb() values and sliders back into a HEX code.
Common mistakes and limits
- Expanding shorthand the wrong way#F53 is #FF5533, not #F50033 or #F05030. Each single digit is repeated, never padded with a zero.
- Reading the alpha pair as a percentageIn #FF573380, 80 is hexadecimal for 128, which is about 50% opacity, not 80%.
- Mixing up ARGB and RGBA orderCSS puts the alpha last (#RRGGBBAA). Android and some other platforms put it first (#AARRGGBB). Move the pair before pasting into those.
- Typing the letter O instead of zeroHEX only uses 0 to 9 and A to F. An O, G or a space makes the code invalid, and the tool shows an error.
- Expecting HSL to convert back exactlyHSL is rounded to whole numbers here, so converting it back can be off by one or two in each RGB value.