Open tools · 0

About

HEX to RGB

Paste a hex colour code, with or without its #, and its RGB value is there to copy, along with HSL, OKLCH and the rest. A three-digit code is read as its six-digit form, and eight digits carry an alpha, which comes out as rgba(). An rgb() pasted the other way round gives its hex just as well.

What it does

  • Each pair of hex digits is one channel from 0 to 255: #ff8800 is rgb(255, 136, 0).
  • Short codes are doubled digit by digit, so #f80 is #ff8800, and #f808 the same orange at about half opacity.
  • An alpha comes out as rgba(255, 136, 0, 0.502), to three decimals, and the HEX line keeps all eight digits.
  • Six or eight digits need no #, nor three or four with a letter; plain 123 does, as it could be a number.
  • 0xFF8800 is read as hex too, and 0xCCFF8800 alpha first, the way Android and Flutter write colours.
  • A semicolon left on the end from a stylesheet is ignored.
  • HEX in capitals or small letters, as you prefer, remembered for next time.

How to use it

  1. Paste the hex code into the colour field.
  2. Copy the RGB line, or whichever format your code wants.
  3. Move the opacity slider for the rgba() of the same colour.

What it does not do

  • The spaced form rgb(255 136 0) on the way out: commas are what every browser and tool reads, and both forms are read on the way in.
  • Hex codes of five, seven or more than eight digits: CSS defines none of them, so they are refused rather than guessed at.

Questions

How do I convert hex to RGB by hand?

Split the code into three pairs and read each as a number in base 16: the first digit times 16, plus the second. For #1E90FF that is 1×16+14 = 30, 9×16+0 = 144 and 15×16+15 = 255, so rgb(30, 144, 255).

Is RGB more precise than hex?

No. Both give red, green and blue from 0 to 255, hex in base 16 and rgb() in base 10, so the three channels convert exactly both ways. An alpha is written to three decimals in rgba(), which still reads back to the same two hex digits.

What does an eight-digit hex code mean?

The last two digits are the alpha, the opacity, from 00 for clear to FF for solid: #1E90FF80 is that blue at about half opacity. Android writes the alpha first, which is why a code pasted with 0x is read that way.

How do I get the hex code of an rgb() colour?

Paste the rgb() into the same field and copy the HEX line. A bare 255, 136, 0 works too, and so does rgb(255 136 0) with spaces.

Everything here runs in your browser. Nothing you type, paste or open is uploaded, and there is no account and no queue. How that works.

Often used with

  • Palette Maker: the colour grown into a Tailwind-style scale of tints and shades

All toolsAbout utilbrewPrivacy