HEX to RGB Converter
HEX to RGB Converter turns a hexadecimal color code into its RGB and HSL equivalents, with a live swatch so you can see the exact color. Use the color picker or type a HEX value directly.
It is the quickest way to move a color between the formats used in CSS, design tools and code.
rgb(124, 58, 237)hsl(262, 83%, 58%)How to use HEX to RGB Converter
- 1
Enter a HEX color
Type a 3- or 6-digit HEX value like #f00 or #ff0000, or pick one with the color picker.
- 2
Read RGB and HSL
The matching RGB and HSL strings appear instantly, ready to copy.
- 3
Copy the format you need
Copy the rgb() or hsl() string straight into your stylesheet.
HEX, RGB and HSL explained
A HEX code encodes red, green and blue as two hexadecimal digits each, so #ff0000 is pure red. RGB expresses the same channels as decimal numbers from 0 to 255, like rgb(255, 0, 0).
HSL describes color as hue (an angle on the color wheel), saturation and lightness. It is often easier to reason about when you want to make a color lighter, darker or less vivid while keeping the same hue.
Why convert between color formats
Design tools, brand guidelines and code can each prefer a different format. Converting lets you keep a single source of truth — for instance a HEX brand color — and express it as RGB for transparency work (rgba) or HSL for systematic tints and shades.
All three formats are fully supported in modern CSS, so the right choice often comes down to which is easiest to adjust for the task at hand.
Frequently asked questions
- Does it support 3-digit shorthand HEX?
- Yes. Shorthand like #f00 is expanded to #ff0000 before conversion, so both forms work.
- Can I convert HEX to HSL too?
- Yes. The tool shows both the RGB and the HSL equivalents of your HEX color.
- Is there a color picker?
- Yes. Use the native color picker to choose visually, or type a HEX value for precision.
See also
Last updated: