How to Convert RGB to Hex (and Back Again)
Color Code2 min read
RGB and hex codes are the two color formats you will meet most often in CSS, HTML and design tools. They both describe the same three numbers — the red, green and blue channels of a color — just written differently. Once you understand that, converting between them becomes easy.
What RGB and hex codes actually are
An RGB value lists each channel as a decimal number from 0 to 255, for example rgb(220, 20, 60).
A hex code writes those same three channels in base 16 and joins them with a #, for example #DC143C. Each pair of characters is one channel:
DC= 220 (red)14= 20 (green)3C= 60 (blue)
Because each hex character holds 16 values, two characters cover all 256 possible channel values — which is why six digits can describe 16,777,216 colors.
Convert RGB to hex by hand
- Take the red channel and divide it by 16. The whole number is the first hex character, the remainder is the second.
- Repeat for green and blue.
- Convert 10–15 to A–F, join the pairs, and prefix with
#.
For 220: 220 ÷ 16 = 13 remainder 12, which is D and C → DC. That is how rgb(220, 20, 60) becomes #DC143C (Crimson).
Convert hex to RGB by hand
Reverse the process: convert each pair back from base 16 to decimal. #DC143C is (13×16+12, 1×16+4, 3×16+12) = rgb(220, 20, 60).
Do it instantly instead
Hand-converting every color is tedious, so designers use a converter. The RGB to Hex converter turns three channel sliders into a live hex code, and the Hex to RGB converter does the reverse — both also show the HSL values and give you one-click copy for CSS.
Need to start from a visual color instead? Use the color picker to dial in any shade, or explore 350+ named colors with their exact codes in the color library.
A quick reference
Common conversions: white#FFFFFF=rgb(255, 255, 255), black#000000=rgb(0, 0, 0), and pure red#FF0000=rgb(255, 0, 0).
/* Both of these are the same Crimson color */
color: rgb(220, 20, 60);
color: #dc143c;The next time you see a hex code in a design file and need an RGB value for a canvas API — or the other way around — remember it is just base-16 arithmetic, and our converters do it for you in real time.
Tools for this guide
Related posts
How to Convert CMYK to RGB (With the Exact Formula)
Print files speak CMYK and screens speak RGB. Here are the exact formulas for converting between them, two worked examples, and the one catch that makes real print conversion harder than the math suggests.
Colors With Opacity in CSS: RGBA, HSLA and 8-Digit Hex
You can add transparency to any CSS color with rgba(), hsla() or 8-digit hex. Here is how each syntax works, when to use which, and the pitfalls to avoid.