Convert a hex color code straight into hue, saturation and lightness. Hex is the format you copy out of design tools and CSS, but it hides the underlying structure of a color; HSL makes that structure obvious by expressing the color as a position on the hue wheel plus how saturated and how light it is. That makes it much easier to build a matching set of tints and shades, or to shift a brand color to a related one. Paste a six-digit or shorthand hex value and this tool decodes it, shows the exact hsl() string beside a live swatch, and copies the result on demand. Everything is computed locally in your browser.