How to Convert HEX to RGB (and Back) (2026)
You can convert any hex color to RGB and back in seconds with our free Hex to RGB Converter. Type a hex code like #3B82F6 to see its rgb(59, 130, 246) equivalent, or enter RGB values to get the hex code — all with a live color swatch and copy-ready CSS.
How Hex and RGB Color Codes Work
Hex (hexadecimal) and RGB are two ways to represent the same color. Both break a color into its red, green, and blue channels, each ranging from 0 to 255. A hex code like #3B82F6 stores three two-digit hexadecimal numbers: red (3B = 59 in decimal), green (82 = 130), and blue (F6 = 246). RGB writes the same values as rgb(59, 130, 246). A 3-digit hex shorthand like #abc expands to #aabbcc by doubling each digit. The two formats are fully interchangeable in CSS — browsers render them identically.
How to Use Our Hex to RGB Converter
- Open the Hex to RGB Converter and type a hex color code into the Hex field — with or without the
#prefix. - Watch the RGB values and the color preview swatch update instantly.
- To go the other way, type numbers into the R, G, and B fields and see the matching hex code appear.
- Click Copy next to the format you need to paste it into your CSS or design tool.
Example Conversions
| Hex | RGB | CSS Usage |
|---|---|---|
#000000 | rgb(0, 0, 0) | Black text |
#ffffff | rgb(255, 255, 255) | White background |
#ff0000 | rgb(255, 0, 0) | Red accent |
#3B82F6 | rgb(59, 130, 246) | Blue primary |
#10b981 | rgb(16, 185, 129) | Green success |
#f59e0b | rgb(245, 158, 11) | Amber warning |
Common Use Cases
- CSS development — some codebases prefer hex, others use RGB. Convert between them freely from the same tool.
- Design tool import — copy hex from Figma or Sketch and get the RGB equivalent for use in code.
- Accessibility tools — convert to RGB to use with RGBA for transparency or to compare contrast ratios.
- Quick reference — keep the tool open while coding to translate colors on the fly.
FAQ
How do I convert hex to RGB manually?
Split the six-digit hex into three pairs, then convert each pair from base-16 to decimal. For example, 3B in hex is 3×16 + 11 = 59 in decimal. The Hex to RGB Converter does this math instantly.
What is the difference between 3-digit and 6-digit hex?
Three-digit hex (#abc) is shorthand where each digit is doubled to produce a six-digit value (#aabbcc). It gives you access to 4,096 colors instead of the full 16.7 million, but it is convenient for common web-safe colors.
How do I add transparency to RGB?
Use the rgba() function in CSS: rgba(59, 130, 246, 0.5) adds 50% opacity. The RGB values from this converter work directly in rgba() — just add the alpha channel.
Does the converter work for CSS variables?
Yes. Both hex and RGB values can be used in CSS custom properties. Copy the format that matches your project’s convention and use it in var() references.
Should I use HSL instead?
For adjusting a color (lighter, more muted) or building a palette, HSL is easier than hex or RGB because the hue is a single angle you can rotate. Hex stays best for storing colors in CSS. See Hex, RGB & HSL: Convert Colors and Build a Palette for when each one wins.
Need the RGB behind a hex code — or a whole palette from it? Convert it in the Hex to RGB Converter, then read Hex, RGB & HSL to turn one brand color into a coordinated set of tints, shades, and accents.