HSL to Lab Converter

Converted Lab Output --
100%

Wide-Gamut & Linear Formats

Modern CSS color space notations derived from this color

Contrast Analysis (WCAG 2.1)

Checks the converted color against foreground or background targets for accessibility compliance.

How to Convert HSL to CIELAB (Lab)

Converting HSL to CIELAB (Lab) is a major upgrade in color accuracy. You are taking a color defined by the flawed, device-dependent sRGB color model and mapping it into a scientifically accurate, perceptually uniform color space.

The Problem with HSL

HSL is easy to read, but it lies to your eyes. In HSL, every color with a Lightness of 50% is supposed to be equally bright. However, if you put a pure yellow hsl(60deg 100% 50%) next to a pure blue hsl(240deg 100% 50%), the yellow is very bright while the blue looks quite dark. HSL does not account for how the human eye actually perceives different wavelengths of light.

The CIELAB Solution

CIELAB (Lab) was designed by the International Commission on Illumination to fix this exact problem. In Lab space, the L (Lightness) channel is absolute. If two colors have a Lab lightness of 60%, they will look equally bright to a human observer, regardless of their hue.

The a and b channels handle the color itself, operating on green-red and blue-yellow opponent axes.

The Conversion Pipeline

Because HSL is just a cylindrical wrapper around RGB, the conversion to Lab requires a heavy mathematical pipeline:

  1. Convert HSL to standard RGB.
  2. Remove the gamma correction curve to get Linear RGB.
  3. Convert Linear RGB to the CIE XYZ reference space.
  4. Transform XYZ into the perceptual Lab axes using a non-linear cube-root function.

Related Tools