HEX to RGB Converter

Paste a hex code, you get the RGB right back. Every converter does that, so that part is no big deal. What actually matters is the stuff that trips up the other tools: 8-digit hex with an alpha channel, shorthand like f0f, and codes with or without the #. Hand this one #ff00ff80 and it just gives you rgba(255, 0, 255, 0.5). No error, no broken output, it just does what a converter should have done all along.

And look, if you write CSS you already know what hex is. So I'm going to skip the base-16 lecture and get to the parts that actually cause problems.

1. Paste or type a hex code. The # is optional, so #4f46e5 and 4f46e5 both land the same.
2. Or grab the color picker and eyeball it. Everything updates live as you drag.
3. Copy whatever you need. There's a button on the full rgb() string, on the rgba() version, and on every other row too, so HSL, HSV and CMYK are one click away without a second tool.

Type shorthand like f0f and it expands to #ff00ff on its own. Type junk and it doesn't blow up, it just waits and shows you a hint about what it takes.

For a plain solid color in CSS? Honestly, don't bother. The browser reads #4f46e5 and rgb(79, 70, 229) as the exact same thing, so just use whatever your design tool spat out, which is basically always hex.

You actually want RGB the moment you need to do something with the color. Fade it with an opacity. Tweak one channel in code. Spin up a whole family of tints off one base by keeping the R, G, and B and only moving the alpha. That is way easier to read as rgba(79, 70, 229, 0.4) than some 8-digit hex you have to sit there and decode. The same holds once you leave the browser. Photoshop, native mobile, most charting libraries, they all want plain 0-to-255 numbers, so you pull the decimals off the hex and hand those over.

This is the one that gets people. Modern CSS lets you stick a transparency pair on the end of a hex code, #RRGGBBAA. Those last two digits are the alpha, 00 is fully see-through, FF is solid. And most free converters botch it completely. They either ignore that pair and pretend it isn't there, or hand you back something broken.

This one doesn't. Paste #ff573380 and you get rgba(255, 87, 51, 0.5), alpha already converted to the 0-to-1 decimal that rgba() actually wants.

The math is worth knowing, because it catches people. Alpha in hex is a 0-to-255 value like every other channel, but rgba() wants a fraction. So you take the pair, convert to decimal, divide by 255. 80 is 128. 128 over 255 is about 0.5. That is the whole trick, and it is why "50 percent" opacity comes out as 80, not 7F, and definitely not 50. The tool does it for you, but at least now the number makes sense.

Shorthand only works when both digits of a channel match. #f0f is fine, it doubles out to #ff00ff, and #f80 doubles out to #ff8800. What shorthand cannot give you is a channel whose two digits differ. There is no three-digit way to write #ff8000, because that middle 80 would have to come from doubling a single 8, and doubling an 8 gives you 88. If any channel needs uneven digits, write all six.

Leading zeros matter going the other way. Converting RGB back to hex, a channel under 16 still needs both slots filled. 5 is 05, not 5. Drop that zero and the whole string slides over one spot and you get a color nobody asked for.

And every plain 6-digit code is fully solid. #ff00ff is the same color as rgba(255, 0, 255, 1). No alpha pair just means the alpha is 1.