Color Converter
Convert a color between HEX, RGB and HSL formats with a live swatch preview - edit any value and the others update instantly.
#3b82f6
rgb(59, 130, 246) · hsl(217, 91%, 60%)
RGB
HSL
Frequently asked questions
What's the difference between RGB and HSL?
RGB describes a color by its red, green and blue light components (0-255 each). HSL describes the same color by hue (position on the color wheel, 0-360°), saturation (intensity, 0-100%) and lightness (0-100%). HSL is often more intuitive for adjusting a color, like making it lighter or more muted, without changing its hue.
Can I enter a 3-digit hex code like #fff?
Yes, shorthand 3-digit hex codes are expanded automatically, #fff becomes #ffffff before converting.
Why would I convert HEX to HSL instead of just using HEX everywhere?
HSL makes certain CSS tricks easier, like generating a set of consistent color shades by only changing the lightness value, or building an accessible color palette by controlling saturation and lightness independently of hue.