HEX to RGB converter
Paste a HEX code such as #1F6FB2 (or the shorthand #1F6) and get its RGB values, ready for code or apps.
| HEX | #1F6FB2 |
|---|---|
| RGB | rgb(31, 111, 178) |
| HSL | hsl(207, 70%, 41%) |
| CMYK | cmyk(83%, 38%, 0%, 30%) |
How to convert HEX to RGB by hand
- Drop the # and split the code into three pairs: RR GG BB.
- For each pair, multiply the first digit by 16 and add the second (A=10 … F=15).
- Those three numbers are R, G and B.
Worked example
1F → 1×16 + 15 = 31
6F → 6×16 + 15 = 111
B2 → 11×16 + 2 = 178
Result: rgb(31, 111, 178)Good to know
- A 3-digit code doubles each digit: #1F6 = #11FF66.
- For 8-digit codes the last pair is alpha: divide by 255 for the rgba() opacity.
- Every HEX code maps to exactly one RGB triple, so the conversion is lossless.
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: HEX and RGB 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
How do I convert HEX to RGBA?
Convert the first six digits as usual, then add the alpha: for #1F6FB280, 80 = 128, and 128 ÷ 255 ≈ 0.5, giving rgba(31, 111, 178, 0.5).
What RGB is #000000?
rgb(0, 0, 0), pure black. #808080 is rgb(128, 128, 128), middle grey.
Why does my HEX code look different in another app?
The numbers are the same, but apps with colour management (Photoshop, Illustrator) may display them through a different colour profile. Browsers assume sRGB.