HEX to HSL converter
Convert HEX to HSL in one step. Paste a HEX value and the HSL equivalent updates instantly, with a live preview so you can see exactly what you’re working with.
Try #FF6B35
Updates as you type
How to use this tool
- 1Paste or type your HEX value into the input on the left.
- 2Read the HSL equivalent on the right. It updates as you type.
- 3Click the copy button next to the HSL value to put it on your clipboard.
About this tool
HEX is fast to copy from a design file, but it tells you nothing about hue or lightness. HSL (hue-saturation-lightness) does, which makes it easier to build accessible color systems, dark-mode variants, and tints or shades programmatically.
Related tools
HEX to RGB converter
Convert HEX colors to RGB instantly. Paste a value, copy the result. Works for design, web, and print workflows.
RGB to HEX converter
Convert RGB colors to HEX instantly. Paste a value, copy the result. Works for design, web, and print workflows.
HSL to HEX converter
Convert HSL colors to HEX instantly. Paste a value, copy the result. Works for design, web, and print workflows.
HEX to CMYK converter
Convert HEX colors to CMYK instantly. Paste a value, copy the result. Works for design, web, and print workflows.
CMYK to HEX converter
Convert CMYK colors to HEX instantly. Paste a value, copy the result. Works for design, web, and print workflows.
RGB to HSL converter
Convert RGB colors to HSL instantly. Paste a value, copy the result. Works for design, web, and print workflows.
Frequently asked questions
Short answers to what people ask most.
How do I convert HEX to HSL?
Is the HEX to HSL conversion accurate?
Do you store the colors I convert?
Can I use HEX values with or without a hash / parentheses?
When should I use HSL instead of HEX?
Reviewing work with your team?
Pin comments directly on a live website or design — no extension, no setup.