RGB to HEX Converter
Turn red, green and blue values into a HEX code.
RGB to HEX Converter: the tool
RGB values
0 to 1, or a percentage. Leave it at 1 for an opaque color.
HEX code
#FF6347
- Six digits
- Short formNone: the digits do not repeat in pairs
| Channel | Decimal | Hex | Binary |
|---|---|---|---|
| Red | 255 | FF | 11111111 |
| Green | 99 | 63 | 01100011 |
| Blue | 71 | 47 | 01000111 |
Enter the red, green and blue values of a color, or move the sliders, and get its HEX code at once. Add an opacity to get the eight-digit form that includes transparency, switch between uppercase and lowercase, and see the short form when one exists. A table shows how each channel becomes two hexadecimal digits, so the conversion is easy to follow and to check.
How it works
Each of the three channels is a whole number from 0 to 255, which is exactly what two hexadecimal digits can hold. To write a channel in base sixteen, divide it by 16: the quotient is the first digit and the remainder is the second, with 10 to 15 written as A to F. A red of 255 is 15 and 15, so FF. A green of 99 is 6 and 3, so 63. A blue of 71 is 4 and 7, so 47. Together: #FF6347.
Opacity is a number from 0, fully transparent, to 1, fully opaque, which can also be written as a percentage. It is multiplied by 255, rounded, and written as a fourth pair of digits at the end, so half opacity becomes 80 and gives an eight-digit code such as #FF634780. A fully opaque color needs no fourth pair, so the code stays at six digits.
When all three pairs have two identical digits, as in #FFCC00, the code can be shortened to #FC0. The tool shows that short form whenever it exists. The binary column of the table writes each channel as eight bits, the way the screen stores it, which is why the largest value of a channel is 255.
How to use it
- Type a value from 0 to 255 for red, green and blue, or move the sliders. A percentage such as 50% is accepted too.
- Leave the alpha at 1 for an opaque color, or lower the opacity to get an eight-digit code.
- Or paste a whole rgb() value into the last field and the numbers fill in.
- Press Copy to take the HEX code. Tick Lowercase letters if your style guide asks for it.
Example
The color rgb(255, 99, 71) converted by the same code as the tool above, with the digits of each channel.
What was set
- Red
- 255
- Green
- 99
- Blue
- 71
- Opacity
- 100%, then 50%
What came out
- HEX code
- #FF6347
- Red as hex
- FF (11111111)
- Green as hex
- 63 (01100011)
- Blue as hex
- 47 (01000111)
- At 50% opacity
- #FF634780
Good to know
- Each value must be from 0 to 255. A decimal such as 127.6 is rounded to the nearest whole number, and a value outside the range is reported with the name of the field.
- The eight-digit form is part of CSS Color Level 4 and works in all current browsers, but some older tools and email clients read only six digits.
- The HEX code is the same color as the RGB numbers. How it looks still depends on the screen and its color settings.
Questions people ask
How do I convert RGB to HEX by hand?
Write each channel in base sixteen with two digits: divide by 16, use the quotient as the first digit and the remainder as the second, and count 10 to 15 as A to F. Join the three pairs after a # sign.
Does it matter whether HEX letters are uppercase or lowercase?
No, the color is the same. Style guides differ, with many stylesheets preferring lowercase and design tools showing uppercase, so the tool lets you choose.
Can I enter a percentage instead of a number from 0 to 255?
Yes. A value such as 50% is read as half of 255, rounded to 128. This is useful for values copied from a design file that uses percentages.
What is the alpha value?
Alpha is how opaque a color is: 1 is solid, 0 is invisible, and 0.5 lets half of what is behind it show through. In HEX it is the last two digits, from 00 to FF.