How does HEX to RGB conversion work?
A HEX color code is a 6-digit base-16 number, written as three pairs — one pair each for red, green, and blue. RGB describes the same color as three base-10 numbers from 0–255. Converting between them means converting each hex pair from base 16 to base 10.
For example, #2563EB splits into 25, 63, and EB. Converting each pair gives 37, 99, and 235. That's why #2563EB and rgb(37, 99, 235) are the same color — just written two different ways.
HEX vs. RGB — when to use each
They represent identical information. HEX is more compact and standard in HTML, CSS, and design tools like Figma and Sketch. RGB is more readable when working with canvas APIs, image processing, or animation libraries that accept numeric channel values.
Common color reference
Common web colours with their RGB, HEX, and HSL equivalents.
| Colour name | Hex code | RGB value | HSL value | |
|---|---|---|---|---|
| Black | #000000 | rgb(0, 0, 0) | hsl(0, 0%, 0%) | |
| White | #FFFFFF | rgb(255, 255, 255) | hsl(0, 0%, 100%) | |
| Red | #FF0000 | rgb(255, 0, 0) | hsl(0, 100%, 50%) | |
| Lime | #00FF00 | rgb(0, 255, 0) | hsl(120, 100%, 50%) | |
| Blue | #0000FF | rgb(0, 0, 255) | hsl(240, 100%, 50%) | |
| Yellow | #FFFF00 | rgb(255, 255, 0) | hsl(60, 100%, 50%) | |
| Cyan | #00FFFF | rgb(0, 255, 255) | hsl(180, 100%, 50%) | |
| Magenta | #FF00FF | rgb(255, 0, 255) | hsl(300, 100%, 50%) | |
| Orange | #FF8000 | rgb(255, 128, 0) | hsl(30, 100%, 50%) | |
| Coral | #FF6347 | rgb(255, 99, 71) | hsl(9, 100%, 64%) | |
| Silver | #C0C0C0 | rgb(192, 192, 192) | hsl(0, 0%, 75%) | |
| Gray | #808080 | rgb(128, 128, 128) | hsl(0, 0%, 50%) | |
| Maroon | #800000 | rgb(128, 0, 0) | hsl(0, 100%, 25%) | |
| Olive | #808000 | rgb(128, 128, 0) | hsl(60, 100%, 25%) | |
| Green | #008000 | rgb(0, 128, 0) | hsl(120, 100%, 25%) | |
| Amber | #F59E0B | rgb(245, 158, 11) | hsl(38, 92%, 50%) | |
| Purple | #800080 | rgb(128, 0, 128) | hsl(300, 100%, 25%) | |
| Teal | #008080 | rgb(0, 128, 128) | hsl(180, 100%, 25%) | |
| Navy | #000080 | rgb(0, 0, 128) | hsl(240, 100%, 25%) | |
| Indigo | #4B0082 | rgb(75, 0, 130) | hsl(275, 100%, 25%) |
More Colors with RGB, HEX, and HSL values
Frequently asked questions
Does uppercase vs. lowercase matter?
#2563EB and #2563eb are identical — hexadecimal letters A–F are not case-sensitive. This converter accepts either.
What is 3-digit hex shorthand?
CSS allows a 3-digit shorthand where each digit is doubled — #06F expands to #0066FF. This converter accepts 3-digit codes and expands them automatically.
What is the difference between rgb() and rgba()?
rgba() adds a fourth alpha value controlling opacity from 0 to 1. A standard HEX code has no opacity, so its equivalent is always rgba(r, g, b, 1). Some tools use 8-digit hex codes to include alpha — the last two digits represent opacity.