HSL is the most intuitive color model for web designers because it separates hue, saturation, and lightness into independent channels. Want a lighter version of your brand color? Just increase the lightness value. Need a desaturated variant? Lower the saturation. This converter takes any hex code and gives you the corresponding HSL values, making it easy to create systematic color palettes, hover states, and accessible contrast variations from a single base color.
Color Converter
Convert any color between HEX, RGB, HSL, and CMYK with a live preview, copy-able values, and a tints & shades strip.
#3B82F6rgb(59, 130, 246)hsl(217, 91%, 60%)cmyk(76%, 47%, 0%, 4%)HEX — 6-digit hexadecimal code used widely in web design (e.g., #FF5733).
RGB — Red, Green, Blue channels (0–255 each), the additive color model for screens.
HSL — Hue (0–360°), Saturation (0–100%), Lightness (0–100%). More intuitive for humans.
CMYK — Cyan, Magenta, Yellow, Key (Black) — the subtractive model used in printing.