LAB to HSL
Color Convert Engine
Enter a color in any supported format; the engine outputs every other color space.
Input Mode
Accepts #RGB or #RRGGBB, with or without #.
Preview
#1E40AF
Preview uses the sRGB color space.
Output — all color spaces
How to use
- Paste LAB values from instrumentation or color QA tooling, note the assumed white point (often D65 for web-adjacent work), then compare previews cautiously on consumer displays.
- LAB outside display gamut maps unpredictably—neon greens and saturated magentas are frequent offenders.
- Cross-check brand-critical colors in both LAB-native tooling and your shipping HEX/RGB pipeline.
FAQ
What is LAB to HSL used for?
LAB to HSL is used when your source color is expressed as CIELAB coordinates (`L*`, `a*`, `b*`) used for perceptual comparisons but your destination expects hue, saturation, and lightness (`hsl()` / `hsla()` style angles and percentages)—common when aligning design tools, CSS, print specs, or APIs.
Is my data uploaded?
No. Processing runs locally in your browser.
Which white point does LAB conversion assume?
Web-facing conversions commonly assume D65; if your source specifies another illuminant, reconcile profiles before treating numbers as exact.
Introduction
CIELAB (L*, a*, b*) measures lightness plus green–red and blue–yellow opponent axes in a space designed for perceptually even spacing between colors. That is what we treat as the from (LAB) color encoding on this page.
HSL splits color into a hue angle (degrees), saturation (how vivid it is), and lightness (blend toward white or black)—the same mental model as CSS hsl(). That is the to (HSL) encoding you get after conversion.
A LAB to HSL converter bridges them when your pipeline outputs LAB but the next step expects HSL—without redoing the coordinate math by hand.
What is LAB to HSL?
LAB to HSL maps colors described in CIELAB coordinates (L*, a*, b*) used for perceptual comparisons into hue, saturation, and lightness (hsl() / hsla() style angles and percentages). The perceptual aim is the same color expressed with different coordinates—ideal when downstream systems disagree on notation.
Key Features
Fast conversion helps when you are juggling LAB inputs against HSL consumers in the same sprint.
Live preview catches transcription mistakes early, especially when channels have different ranges or units.
Copy-ready output reduces slack-and-paste errors moving from spreadsheets or PDF specs into code.
Common Use Cases
- Shipping UI tokens where APIs expose LAB but theme files require HSL.
- Preparing brand palettes for mixed pipelines—web RGB alongside print CMYK or perceptual LAB QA.
- Debugging divergent pickers by exporting one canonical mix and re-importing it elsewhere.
Best Practices
- Normalize inputs (confirm units and ranges) before trusting downstream diffs.
- Compare previews on both light and dark chrome when lightness or chroma shifts affect perceived contrast.
- Bookmark the inverse HSL to LAB when you frequently round-trip edits.
Related tools
These complement LAB to HSL when you are iterating palettes under real UI constraints:
- Color Converter — Jump to any supported pair from the suite hub.
- HSL to LAB — Reverse direction when edits bounce between teams.
- LAB to HEX — Nearby conversion from the same LAB source when you need another output format.
- Color Picker — Dial or sample a color visually, then route it through the converter chain.