Color Converter (HEX ⇄ RGB ⇄ HSL)
Type a color in any format — or pick one — and get all the equivalent CSS color codes instantly.
HEX, RGB, or HSL — which should I use?
They describe the same colors. HEX (#4f46e5) is the compact classic. RGB maps directly to screen pixels and adds alpha easily (rgba). HSL — hue, saturation, lightness — is the most human-friendly for design work: lightening a color is just raising L, and building a palette is rotating H.
Frequently asked questions
What formats can I type in?
#rgb, #rrggbb, rgb(r, g, b), and hsl(h, s%, l%) — with or without spaces. The picker button works too.
How does HSL relate to RGB?
HSL is a cylindrical re-mapping of the RGB cube: hue is the angle around the color wheel (0° red, 120° green, 240° blue), saturation is the distance from gray, and lightness runs from black (0%) to white (100%).
Last updated: 2026-07-11