Hex to RGB Converter
Web colours are almost always written in hex, but design tools and CSS both increasingly use RGB and HSL too — this converts a hex colour to both formats instantly, so a designer's Figma value and a developer's CSS variable can be checked against each other directly.
Inputs
Result
rgb(79, 70, 229)
hsl(243, 75%, 59%)
How the hex to rgb converter works
Hex colour codes split into three pairs of hex digits, one each for red, green and blue (each ranging 00-FF, i.e. 0-255 in decimal).
RGB values are then converted to HSL (hue, saturation, lightness) using the standard colour-space conversion formula, which is often more intuitive for adjusting a colour's shade or vibrancy directly.
Worked example: hex #4F46E5
- R = 4F (79), G = 46 (70), B = E5 (229) in decimal → rgb(79, 70, 229).
- Converting to HSL gives approximately hsl(243°, 75%, 59%) — a vivid blue-purple.
Common mistakes to avoid
Assuming a short 3-digit hex code (like #FFF) works the same as a full 6-digit one here
This tool expects a full 6-digit hex value — shorthand 3-digit hex codes (where each digit is doubled, e.g. #FFF meaning #FFFFFF) need to be expanded to their full 6-digit form first.
Confusing HSL's saturation and lightness with RGB's individual channel brightness
HSL describes colour in terms of hue (the base colour), saturation (how vivid vs. grey) and lightness (how light vs. dark) — this is a fundamentally different, often more intuitive mental model than RGB's three separate colour-channel intensities.
Frequently asked questions
Why do designers often prefer HSL over RGB for adjusting colours?
HSL separates 'what colour' (hue) from 'how vivid' (saturation) and 'how light or dark' (lightness) — this makes intuitive adjustments, like 'make this a bit darker' or 'make this less saturated', much more direct than fiddling with three separate RGB channel numbers.
What does a hue value of 0 versus 240 represent?
Hue is measured in degrees around a colour wheel — 0° is red, 120° is green, 240° is blue, with everything in between representing a smooth gradient through the colour spectrum.
How is this related to the Hex Converter?
The Hex Converter handles general hex-to-decimal/binary conversion for any hex number; this tool is specifically built for colour hex codes and converts them into colour-specific formats (RGB, HSL) rather than plain numeric bases.
Can I convert from RGB or HSL back to hex using this tool?
This specific tool converts starting from hex only — for the reverse direction, most design and browser dev tools include a colour picker that shows the equivalent hex value directly.
Related calculators
Hex Converter
Convert hexadecimal values to decimal and binary.
Binary Converter
Convert decimal numbers to binary and back.
Text Case Converter
Convert text between common naming cases.
ASCII Converter
Convert text to ASCII character codes.
URL Slug Generator
Turn any title into a clean URL slug.