HEX to RGB Color Converter

Convert a HEX color code to RGB, or RGB values back to HEX. You also get RGBA and HSL, a live preview, and a text contrast check. Everything runs in your browser, so your data stays on your device.

Text contrast
White text 3.15:1 · Black text 6.66:1

Like #FF5733, #F53, or #FF573380

Like 255, 87, 51 or rgba(255, 87, 51, 0.5)

Red
255
Green
87
Blue
51
Alpha (opacity)
100%
HEX
#FF5733
RGB
rgb(255, 87, 51)
RGBA
rgba(255, 87, 51, 1)
HSL
hsl(11, 100%, 60%)
RGB values
255, 87, 51
RGB from 0 to 1
1.000, 0.341, 0.200

What is a HEX color code?

A HEX color code is a # followed by six characters, like #FF5733. The first two characters set how much red is in the color, the next two set green, and the last two set blue. Each pair is a number from 00 to FF in base 16, which is the same as 0 to 255 in the RGB system. HEX codes are short and easy to copy, so they are the most common way to write colors in CSS and design apps. This tool turns a HEX code into its RGB numbers and back again.

Why use our HEX to RGB converter

  • ·Free. No signup, no paywall, no limits.
  • ·Runs in your browser. Nothing gets uploaded, your data stays with you.
  • ·Both directions. HEX to RGB and RGB to HEX in the same place, updated as you type.
  • ·Handles transparency. Reads 8-digit HEX codes and RGBA values with alpha.
  • ·Every format at once. Copy HEX, RGB, RGBA, HSL, or 0 to 1 values with one click.

What the HEX to RGB converter does

HEX to RGB

Type or paste a HEX color code and get its red, green, and blue values right away. The # is optional and upper or lower case both work.

Input#FF5733Resultrgb(255, 87, 51)

RGB to HEX

Enter three RGB values from 0 to 255 and get the matching HEX code. You can paste plain numbers or a full CSS value like rgb(255, 87, 51).

Inputrgb(255, 87, 51)Result#FF5733

Short and transparent HEX codes

Reads 3-digit shorthand codes and 8-digit codes with an alpha (transparency) value. The alpha is turned into an RGBA value between 0 and 1.

Input#F538Resultrgba(255, 85, 51, 0.53)

HSL and decimal values

Also shows the color as HSL and as RGB values from 0 to 1, which some apps and game engines use instead of 0 to 255.

Input#FF5733Resulthsl(11, 100%, 60%)

How to convert HEX to RGB by hand

Split the HEX code into three pairs of characters. Each pair is a base 16 number, where the letters A to F stand for 10 to 15. Multiply the first character by 16 and add the second one. Here is #FF5733 worked out:

ChannelHEX pairMathRGB value
RedFF15 × 16 + 15255
Green575 × 16 + 787
Blue333 × 16 + 351

So #FF5733 is rgb(255, 87, 51). To go from RGB to HEX, do the reverse. Divide each number by 16. The whole part is the first character and the remainder is the second. For example, 87 ÷ 16 is 5 with 7 left over, which gives 57.

Common HEX and RGB color values

These are the basic web colors with their HEX codes and RGB values.

ColorHEXRGB
Black#000000rgb(0, 0, 0)
White#FFFFFFrgb(255, 255, 255)
Red#FF0000rgb(255, 0, 0)
Green (lime)#00FF00rgb(0, 255, 0)
Blue#0000FFrgb(0, 0, 255)
Yellow#FFFF00rgb(255, 255, 0)
Cyan#00FFFFrgb(0, 255, 255)
Magenta#FF00FFrgb(255, 0, 255)
Orange#FFA500rgb(255, 165, 0)
Purple#800080rgb(128, 0, 128)
Gray#808080rgb(128, 128, 128)
Navy#000080rgb(0, 0, 128)

When to convert HEX to RGB

Designers and developers switch between color formats all the time. Here are the most common reasons:

  • ·Adding transparency in CSS. Turn a HEX code into an rgba() value so you can set its opacity.
  • ·Matching brand colors. Copy a HEX code from a design file or style guide into an app that only accepts RGB, or the other way around.
  • ·Writing app or game code. Many frameworks and game engines take RGB numbers, some from 0 to 255 and some from 0 to 1.
  • ·Checking readability. See whether white or black text is easier to read on a background color.
  • ·Reading someone else's code. Find out what color a HEX or RGB value in a stylesheet actually is.

Frequently asked questions

How do I convert HEX to RGB?
Type or paste your HEX code into the HEX box, for example #FF5733. The RGB value appears right away as rgb(255, 87, 51), along with RGBA and HSL. Click the copy button next to any value to copy it.
How do I convert RGB to HEX?
Type your red, green, and blue values into the RGB box, for example 255, 87, 51, or drag the sliders. The HEX code updates as you go and shows #FF5733. You can also paste a full CSS value like rgb(255, 87, 51). To convert a whole list of colors or 0 to 1 values, use the RGB to HEX converter.
What is the formula to convert HEX to RGB?
Split the six HEX digits into three pairs for red, green, and blue. Each pair is a base 16 number, so multiply the first digit by 16 and add the second digit. The letters A to F stand for 10 to 15. For example, FF is 15 × 16 + 15 = 255, and 57 is 5 × 16 + 7 = 87.
What is a 3-digit HEX code?
It is a shorthand where each digit is written once instead of twice. #F53 means the same as #FF5533. The converter expands short codes for you, so you can paste either form.
What does an 8-digit HEX code mean?
The last two digits set the alpha, which is how see-through the color is. 00 is fully transparent and FF is fully solid. For example, #FF573380 ends in 80, which is about 50% opacity, so it converts to rgba(255, 87, 51, 0.5).
What is the difference between HEX and RGB?
They describe the same color in two different ways. RGB lists the red, green, and blue amounts as numbers from 0 to 255. HEX writes those same three numbers in base 16 and joins them into one code. Browsers and design apps accept both, so you can use whichever one your code or tool expects.
What do the contrast numbers mean?
They show how readable white text and black text would be on top of your color. The WCAG accessibility guidelines ask for at least 4.5:1 for normal text and 3:1 for large text. A higher number means easier reading.
Is my data safe and private?
Yes. Every conversion runs locally in your browser, so nothing is uploaded to a server. Once the page has loaded you can even use it offline.