free · in-browser · no upload
Drop your Hex codes file. We'll convert it to HSL right here in your browser, your file never leaves your device.
Select your file here to get started
or drop your file here.
Accepts .txt, .hex
How it works
Click the dropzone above or drag a Hex codes from your desktop. Files of any size, there's no upload, so there's no upload limit.
The conversion runs entirely in this tab using JavaScript and WebAssembly. Your file never touches our servers, we don't have any.
Get your HSL the moment the conversion finishes. Convert another, or close the tab.
Your file is never uploaded. The entire conversion runs in your browser using WebAssembly. We can't see what you convert because we have no server to see it.
Server converters cap free users at 1-2 GB and gate larger files behind a paid plan. Since nothing uploads, our limit is whatever your browser can handle.
No account required. No watermark on the output. No queue. Drop a file, get a converted file.
Why convert HEX → HSL
Modern design systems generate color scales by varying HSL axes. Tailwind's color palette and Material Design's tonal palettes both compute lighter/darker shades by changing HSL lightness while holding hue+saturation. Converting your brand hex to HSL is the first step to building a full palette around it.
Your brand color is #2563EB. You convert to hsl(217, 91%, 53%). Now you generate the full Tailwind-style 50-900 scale by varying lightness from 95% (50) down to 15% (900) while holding 217° hue and 91% saturation.
HSL values look slightly off vs Photoshop's HSB.
HSL (Hue, Saturation, Lightness) is not the same as HSB/HSV (Hue, Saturation, Brightness). They share Hue but Saturation and Lightness/Brightness are computed differently. Photoshop's color picker uses HSB; CSS uses HSL. Same color, different numbers.
Formats involved
A plain text list of hex color codes (e.g. #FF6B35, one per line). The most portable color-list format, any modern design tool accepts hex. Often the format used by color-palette generators (Coolors, Adobe Color, Khroma) for export.
How to open
Any text editor. Pastes directly into design tools.
HSL describes a color by hue (0-360° around the color wheel), saturation (0-100% gray to vivid), and lightness (0-100% black to white). Designers prefer it over RGB because shifting one dimension keeps the others intact — drop saturation and you get a desaturated version of the same color, no manual rebalancing. CSS supports HSL natively (`hsl(207, 87%, 56%)`) and most modern color systems (Tailwind, Material) generate palettes by varying HSL axes.
How to open
HSL values appear in CSS files, design system tokens, and color-picker tools. Chrome DevTools, Figma, and every modern design app accept `hsl()` notation directly.
Related tools
FAQ
Yes. No signup, no watermark, no daily file count limit. Every conversion runs in your browser, your file never touches our servers because there are no servers.
Nowhere. The conversion runs entirely in your browser using JavaScript and WebAssembly. Your file is never uploaded to our servers. We don't have any servers handling files, there's nothing for us to log, store, or accidentally leak.
Whatever your browser can hold in memory. Practically, this means a few hundred MB on most computers, significantly larger than the 1-2 GB caps that server-upload converters charge for. Very large files (multi-GB) may require closing other browser tabs first.
Color palette interchange between web/design tools. Designer-friendly color specification where you want to vary one dimension. The most common reason to convert is compatibility, HSL works in places where Hex codes doesn't, or vice versa.
Any text editor. Pastes directly into design tools.
Once the page is loaded, the conversion itself runs entirely offline. The first time you use a tool, your browser downloads the conversion library (a one-time cache). If you reload while offline, the page won't load, but you can install the site as a Progressive Web App for full offline use.
Single file at a time for now. Batch conversion is on the roadmap, for now, drop one file, download the result, then convert the next.
