RGB to HEX converter
Type an RGB colour such as 196, 20, 95 — or drag the sliders — and get the HEX code for CSS, Figma or Canva.
| HEX | #C4145F |
|---|---|
| RGB | rgb(196, 20, 95) |
| HSL | hsl(334, 81%, 42%) |
| CMYK | cmyk(0%, 90%, 52%, 23%) |
How to convert RGB to HEX by hand
- Take each channel (0–255) separately.
- Divide by 16: the whole number is the first hex digit, the remainder is the second.
- Write digits 10–15 as A–F.
- Join the three pairs in R, G, B order and put # in front.
Worked example
R 196 → 196 ÷ 16 = 12 remainder 4 → C4
G 20 → 1 remainder 4 → 14
B 95 → 5 remainder 15 → 5F
Result: #C4145FGood to know
- HEX is case-insensitive: #c4145f and #C4145F are identical.
- If every pair has two identical digits (#FF6600) CSS accepts the 3-digit shorthand #F60.
- An 8-digit HEX (#C4145F80) adds alpha; 80 is about 50% opacity.
Need the colour from an image first? Use the colour picker from image — it shows all formats at once.
Where the six HEX digits come from
A HEX code is just the three RGB numbers written in base 16. Each channel gets two digits: the first counts sixteens, the second counts ones. Drag a channel and watch both digits change.
196 = 12×16 + 4 → C4
20 = 1×16 + 4 → 14
95 = 5×16 + 15 → 5F
Digits above 9 are letters: A=10, B=11 … F=15. So FF = 15×16 + 15 = 255, the maximum, and 80 = 8×16 = 128, the midpoint.
Common colours: RGB and HEX reference
Basic web colours and a few popular named shades.
| Colour | HEX | RGB | HSL | CMYK |
|---|---|---|---|---|
| White | #FFFFFF | rgb(255, 255, 255) | hsl(0, 0%, 100%) | cmyk(0%, 0%, 0%, 0%) |
| Black | #000000 | rgb(0, 0, 0) | hsl(0, 0%, 0%) | cmyk(0%, 0%, 0%, 100%) |
| Red | #FF0000 | rgb(255, 0, 0) | hsl(0, 100%, 50%) | cmyk(0%, 100%, 100%, 0%) |
| Lime | #00FF00 | rgb(0, 255, 0) | hsl(120, 100%, 50%) | cmyk(100%, 0%, 100%, 0%) |
| Blue | #0000FF | rgb(0, 0, 255) | hsl(240, 100%, 50%) | cmyk(100%, 100%, 0%, 0%) |
| Yellow | #FFFF00 | rgb(255, 255, 0) | hsl(60, 100%, 50%) | cmyk(0%, 0%, 100%, 0%) |
| Cyan | #00FFFF | rgb(0, 255, 255) | hsl(180, 100%, 50%) | cmyk(100%, 0%, 0%, 0%) |
| Magenta | #FF00FF | rgb(255, 0, 255) | hsl(300, 100%, 50%) | cmyk(0%, 100%, 0%, 0%) |
| Silver | #C0C0C0 | rgb(192, 192, 192) | hsl(0, 0%, 75%) | cmyk(0%, 0%, 0%, 25%) |
| Grey | #808080 | rgb(128, 128, 128) | hsl(0, 0%, 50%) | cmyk(0%, 0%, 0%, 50%) |
| Maroon | #800000 | rgb(128, 0, 0) | hsl(0, 100%, 25%) | cmyk(0%, 100%, 100%, 50%) |
| Olive | #808000 | rgb(128, 128, 0) | hsl(60, 100%, 25%) | cmyk(0%, 0%, 100%, 50%) |
| Green | #008000 | rgb(0, 128, 0) | hsl(120, 100%, 25%) | cmyk(100%, 0%, 100%, 50%) |
| Purple | #800080 | rgb(128, 0, 128) | hsl(300, 100%, 25%) | cmyk(0%, 100%, 0%, 50%) |
| Teal | #008080 | rgb(0, 128, 128) | hsl(180, 100%, 25%) | cmyk(100%, 0%, 0%, 50%) |
| Navy | #000080 | rgb(0, 0, 128) | hsl(240, 100%, 25%) | cmyk(100%, 100%, 0%, 50%) |
| Orange | #FFA500 | rgb(255, 165, 0) | hsl(39, 100%, 50%) | cmyk(0%, 35%, 100%, 0%) |
| Coral | #FF7F50 | rgb(255, 127, 80) | hsl(16, 100%, 66%) | cmyk(0%, 50%, 69%, 0%) |
| Gold | #FFD700 | rgb(255, 215, 0) | hsl(51, 100%, 50%) | cmyk(0%, 16%, 100%, 0%) |
| Tomato | #FF6347 | rgb(255, 99, 71) | hsl(9, 100%, 64%) | cmyk(0%, 61%, 72%, 0%) |
| Hot pink | #FF69B4 | rgb(255, 105, 180) | hsl(330, 100%, 71%) | cmyk(0%, 59%, 29%, 0%) |
| Indigo | #4B0082 | rgb(75, 0, 130) | hsl(275, 100%, 25%) | cmyk(42%, 100%, 0%, 49%) |
| Chocolate | #D2691E | rgb(210, 105, 30) | hsl(25, 75%, 47%) | cmyk(0%, 50%, 86%, 18%) |
| Slate grey | #708090 | rgb(112, 128, 144) | hsl(210, 13%, 50%) | cmyk(22%, 11%, 0%, 44%) |
| Sky blue | #87CEEB | rgb(135, 206, 235) | hsl(197, 71%, 73%) | cmyk(43%, 12%, 0%, 8%) |
Questions people ask
What is the HEX code for rgb(255, 255, 255)?
#FFFFFF (white). rgb(0, 0, 0) is #000000 (black).
Can RGB values have decimals or percentages?
CSS accepts both, e.g. rgb(76.9%, 7.8%, 37.3%). This converter accepts percentages and rounds decimals to the nearest whole 0–255 value, because HEX can only store whole numbers.
Is HEX more accurate than RGB?
No — they hold exactly the same information (16.7 million colours). HEX is just a more compact way to write the three RGB numbers.