RGB to HEX Color Converter
Turn red, green and blue values (0–255 or percentages) into a HEX color code for CSS and design tools. Paste a whole rgb() value, or pick a color.
rgb(255, 100, 50) = #FF6432
Tip: paste a full value such as rgb(255, 100, 50) into any box.
How RGB Becomes HEX
An RGB color has three channels, red, green and blue, each a whole number from 0 to 255. A HEX code writes the same three numbers in base 16, two digits per channel, in the order #RRGGBB. Two hex digits hold exactly 256 values (00 to FF), the same range as one 8-bit channel, so nothing is lost: the color is identical, only the notation changes.
Worked Example: Converting RGB to HEX by Hand
Convert rgb(255, 100, 50) without a calculator. Divide each channel by 16 and keep the remainder.
Red: 255
Green: 100
Blue: 50
Joined in order: #FF6432, a warm orange-red. Small values still need two digits: 12 is 0C, not C.
Decimal to Hex Channel Values
Useful landmarks when reading or adjusting a single channel. 16 is the first value that needs a second non-zero digit.
| Decimal | Hex | Share of full |
|---|---|---|
| 0 | 00 | 0% |
| 1 | 01 | 0% |
| 9 | 09 | 4% |
| 10 | 0A | 4% |
| 15 | 0F | 6% |
| 16 | 10 | 6% |
| 32 | 20 | 13% |
| 64 | 40 | 25% |
| 100 | 64 | 39% |
| 128 | 80 | 50% |
| 160 | A0 | 63% |
| 192 | C0 | 75% |
| 200 | C8 | 78% |
| 224 | E0 | 88% |
| 240 | F0 | 94% |
| 255 | FF | 100% |
RGB to HEX Chart for Common Colours
CSS named colours with their RGB values and HEX codes. Note that CSS "green" is only half brightness, and full green is called "lime".
| Colour | RGB | HEX |
|---|---|---|
| black | 0, 0, 0 | #000000 |
| white | 255, 255, 255 | #FFFFFF |
| red | 255, 0, 0 | #FF0000 |
| lime | 0, 255, 0 | #00FF00 |
| blue | 0, 0, 255 | #0000FF |
| yellow | 255, 255, 0 | #FFFF00 |
| cyan (aqua) | 0, 255, 255 | #00FFFF |
| magenta (fuchsia) | 255, 0, 255 | #FF00FF |
| silver | 192, 192, 192 | #C0C0C0 |
| gray | 128, 128, 128 | #808080 |
| maroon | 128, 0, 0 | #800000 |
| green | 0, 128, 0 | #008000 |
| navy | 0, 0, 128 | #000080 |
| purple | 128, 0, 128 | #800080 |
| teal | 0, 128, 128 | #008080 |
| orange | 255, 165, 0 | #FFA500 |
| tomato | 255, 99, 71 | #FF6347 |
Three-Digit Shorthand HEX
When both digits of every channel are the same, CSS lets you write each channel once: #FF6633 can be shortened to #F63, and #FFFFFF to #FFF. The converter shows the short form whenever it exists. Most colors can't be shortened: #FF6432 has no three-digit equivalent, because 64 and 32 aren't repeated digits.
Percentages and Decimal RGB Values
CSS also accepts channels as percentages, such as rgb(100%, 50%, 0%). A HEX code can only store whole numbers 0–255, so each percentage is scaled to 255 and rounded: 50% of 255 is 127.5, which rounds to 128 (80 in hex), giving #FF8000. Type a percentage, such as 50%, into any box to convert it the same way.
Some design tools show channels as decimals from 0 to 1 instead. Multiply those by 255 and round before converting: 0.4 becomes 102, or 66 in hex.
Frequently asked questions
Should HEX codes be uppercase or lowercase?
Either. #FF6432 and #ff6432 are the same color in CSS and every design tool. Pick one style and keep it consistent across a codebase.
How do I add transparency?
Add a fourth pair for alpha: #RRGGBBAA. FF is fully opaque and 80 is about 50% opaque, so #FF643280 is half-transparent orange-red.
Why does my color look different on another screen?
The HEX value is identical, but screens differ in calibration and color space. Converting RGB to HEX never changes the color itself.
Can an RGB value be higher than 255?
Not in standard 8-bit color. Each channel has 256 levels, 0 to 255, which is exactly what two hex digits can hold.
Sources
- W3C CSS Color Module Level 4: HEX notation, rgb() syntax, percentages and named colours.
Related Tools
Capitalize the first letter of every word.
Turn letters into alphabet positions: A = 1, B = 2.
Turn numbers from 1 to 26 into letters.
Convert HEX color codes into RGB color values.
Express euro cents as an amount in euros.
Express pence as an amount in British pounds.