RGB to hex converter

Type red, green and blue values and get the hex code instantly, with a live preview.

Hex
RGB

Turning RGB into hex

A hex colour code is the same three RGB numbers rewritten in base 16 and glued together. Red, green and blue each run from 0 to 255, and each becomes a two-character pair. To convert a channel by hand, divide it by 16: the whole-number part of the answer is the first character and the remainder is the second, with 10 to 15 written as the letters A to F.

215 ÷ 16 = 13 remainder 7  →  13 is D, 7 stays 7  →  D7

Do that for all three channels, join the pairs in red, green, blue order and put a # in front. The tool above does the whole thing live as you type, and it will not silently guess: if a value is missing or falls outside 0 to 255, it says so instead of clamping it to something you did not ask for.

Worked examples

rgb(215, 38, 61)
215 = D7,  38 = 2 remainder 6 = 26,  61 = 3 remainder 13 = 3D  →  #D7263D
rgb(0, 128, 255)
0 = 00,  128 = 8 × 16 exactly = 80,  255 = FF  →  #0080FF
rgb(46, 204, 113)
46 = 2 remainder 14 = 2E,  204 = 12 remainder 12 = CC,  113 = 7 remainder 1 = 71  →  #2ECC71

Why the numbers stop at 255

Each channel is stored in a single byte, and a byte holds 8 bits, which gives 256 possible values: 0 to 255. That is also why every channel fits so neatly into two hex characters, because two base-16 digits can express exactly 256 values, from 00 up to FF. Multiply the three channels together and you get 256 × 256 × 256 = 16,777,216 possible colours from one compact seven-character code.

Screens build colour additively. Every pixel is three tiny lights, one red, one green and one blue, and the RGB values set how brightly each light shines. All three at 255 gives white, all three at 0 gives black, and everything else lives in between. This is the opposite of mixing paint, which is why rgb(255, 255, 0) makes yellow on a screen rather than the muddy brown a paintbox would give you.

Using hex codes in practice

CSS accepts hex and rgb() interchangeably, so the choice is about readability and habit. Hex is compact, easy to paste into design tools and the standard way brand guidelines record colours. The rgb() form is easier to generate in code and easier to skim when you want a rough sense of a colour. Case never matters: #2ecc71 and #2ECC71 are identical, although uppercase is the convention in most style guides for print and brand work.

Two small refinements worth knowing. First, a hex code can be shortened to three characters only when both characters of every pair match, so #FF00CC can be written #F0C but #D7263D cannot be shortened at all. Second, modern CSS lets you add opacity without switching notation: rgb(215 38 61 / 50%) and the eight-digit form #D7263D80 both mean the same half-transparent red. If you are going the other way, from a hex code back to its RGB values, the hex to RGB converter on this site handles that direction, and the HSL converter is the one to reach for when you want to lighten or darken a colour without changing its character.

Frequently asked questions

How do I convert RGB to hex by hand?

Divide each value by 16. The whole-number part is the first character and the remainder is the second, with 10 to 15 written as A to F. So 215 is 13 remainder 7, which gives D7. Join the three pairs in red, green, blue order and add a # at the front.

Why do hex codes contain letters?

Hexadecimal is base 16, so it needs sixteen digits rather than ten. After 0 to 9 it borrows the letters A to F to stand for 10 to 15. That lets any value from 0 to 255 fit in exactly two characters.

Does it matter if a hex code is uppercase or lowercase?

No. Browsers and design tools treat #d7263d and #D7263D as exactly the same colour. Uppercase is common in brand guidelines and lowercase is common in CSS style guides, so pick one and be consistent. This tool outputs uppercase.

Why do RGB values stop at 255?

Each channel is stored in one byte, which is 8 bits, and 8 bits can hold 256 different values: 0 to 255. That is also why a channel always fits in a two-character hex pair, because FF in base 16 is 255.

What if my RGB values are decimals between 0 and 1?

Some tools, including shaders and certain design plugins, use a 0 to 1 scale instead of 0 to 255. Multiply each value by 255 and round to the nearest whole number first. For example 0.5 becomes 128 and 1.0 becomes 255.

Related tools