Color Converter
Convert between HEX, RGB and HSL with a live preview.
HEX, RGB and HSL explained
All three describe the same colors in different ways. HEX (like #2563EB) and RGB (like rgb(37, 99, 235)) both specify how much red, green and blue to mix. HSL (hsl(220, 82%, 53%)) uses hue, saturation and lightness, which is often more intuitive to tweak by eye — slide the lightness up for a tint, down for a shade. Use whichever your CSS or design tool prefers; this converter keeps them in sync.
Color FAQ
What's the difference between HEX, RGB and HSL?
They all describe the same colors. HEX and RGB specify red, green and blue amounts; HSL uses hue, saturation and lightness, which is often easier to adjust by eye.
How do I convert HEX to RGB?
Split the six-digit hex code into three pairs and convert each from base-16 to a number from 0 to 255. For example #2563EB is rgb(37, 99, 235).
Recently used