HEX to HSL converter
Enter a HEX colour and FileTinker converts it to HSL in real time, alongside the other formats. Every value is editable and ready to use in CSS or a design tool. It all runs in your browser.
More presets
Jump to another preset — each opens its own page ready to go:
How to convert HEX to HSL
- Enter your HEX value in its field, or pick a color with the swatch.
- Read the HSL value as it updates instantly.
- Copy it — ready to use in CSS or your design tool.
About converting HEX to HSL
HEX and HSL describe the same on-screen color in different notations, and converting between them is everyday work in web and graphic design. This page focuses on HEX to HSL, but shows HEX, RGB and HSL together so you always have every format to hand.
Everything runs in your browser, so it's instant and private — no upload, no sign-up. Edit any field and the others update, including the live preview and the native color picker.
Frequently asked questions
How do I convert HEX to HSL?
Type or paste your HEX value (or pick a color with the swatch) and read the HSL value straight off — it updates instantly. Copy it with one click.
Are the values CSS-ready?
The HSL value sits alongside HEX, RGB, HSL and HSV — copy whichever you need. HEX, RGB and HSL paste straight into CSS; HSV (HSB) is a design-tool notation rather than a CSS function.
Can I convert the other way?
Yes. Every field is editable, so you can go from HSL back to HEX too, or to any other format — they all stay in sync.
Is anything uploaded?
No. All the conversion runs in your browser; nothing is sent anywhere.