HEX to RGB Converter
Paste a hexadecimal colour code and get the red, green and blue channel values behind it — exactly, instantly, and ready for rgb() in your CSS.
R
G
B
What does HEX to RGB conversion do?
A HEX colour code is just three RGB channel values written in hexadecimal. #0070DC is nothing more than red 00, green 70 and blue DC stacked together. This tool splits the code into those three pairs and converts each from base-16 back to the familiar 0–255 decimal numbers, giving you the rgb() form that some CSS, canvas and graphics APIs prefer.
Because every two-digit hex pair corresponds to exactly one number from 0 to 255, decoding is exact and lossless — there's no rounding, and the result describes precisely the same colour. It's the inverse of going RGB to HEX, so the round trip always lands you back where you started.
Reaching for RGB is handy when you want to tweak a single channel, feed numbers into JavaScript, or build an rgba() colour by adding an alpha value for transparency.
How to convert HEX to RGB
- 1
Paste the HEX code
Enter a colour code such as #0070DC. Both #RRGGBB and the #RGB shorthand are accepted.
- 2
Read the RGB values
The red, green and blue numbers appear immediately, with a swatch of the colour.
- 3
Use the rgb() string
Copy the ready-made rgb(...) value into your stylesheet, canvas code, or design tool.
Why convert HEX to RGB
Adjust single channels
Working in decimal makes it easy to nudge just the red or blue value without re-deriving the whole code.
Add transparency
Once you have the three numbers you can wrap them in rgba() and append an alpha for partial opacity.
Feed code and APIs
Canvas, WebGL and many libraries expect numeric channels rather than a hex string.
Exact every time
Each hex pair decodes to one specific number, so the colour is reproduced precisely.
Worked example
Decoding a hex code back into its three channel values.
#0070DCrgb(0, 112, 220)Expanding three-digit shorthand
CSS lets you write some colours in a compact three-digit form where each digit is doubled: #0AF means #00AAFF. Shorthand only works when both digits of every channel match, which is why not every colour has one. When you paste shorthand here it's expanded first, then decoded, so #0AF resolves to rgb(0, 170, 255).
Why decimal channels are useful
- Programmatic colour maths is simpler in base-10 than in hexadecimal.
rgba()needs the three numeric channels plus an alpha for opacity.- Animating or interpolating between two colours is done channel by channel.
- Some legacy and graphics tools accept only numeric RGB input.
Frequently asked questions
Yes. Each two-digit hex pair maps to exactly one number from 0 to 255, so there's no rounding and the result is the same colour you started with.
Yes. Shorthand is expanded by doubling each digit (#0AF becomes #00AAFF) before decoding, so you get the correct RGB values either way.
It's optional. Whether you paste #0070DC or 0070DC, the converter reads the six hex digits the same way.
Take the three RGB numbers and use the rgba() function, adding a fourth value from 0 (fully transparent) to 1 (fully opaque), for example rgba(0, 112, 220, 0.5).
An 8-digit #RRGGBBAA code includes an alpha channel as the last pair. This tool focuses on the three colour channels; the final pair would encode opacity separately.
To blend two colours at, say, 50%, take each channel separately: (r1 + r2) / 2, (g1 + g2) / 2, (b1 + b2) / 2. For a different ratio t between 0 and 1, use r1 + t * (r2 - r1) per channel. This gives smooth linear interpolation that CSS animations and canvas gradients use.
Need another tool?
Browse the full toolbox or dig into the blog for the engineering behind it.