How to convert HSL (hue, saturation, lightness) to HSLum (hue, saturation, luminance) and HSLum/RGB?

Question

I want to convert some color values from well know HSL to less known HSLum how to do it?

hsl(0, 1.0, 0.5) - rgb red  is hslum(0, 1.0., 0.54)
hsl(120, 1.0, 0.5 - rgb green is hslum(0, 1.0, 0.80)
hsl(240, 1.0, 0.5) - rgb blue is hslum(0, 1.0, 0.44)

As far as I know luminance (not lightness) is calculate in such way:

Y = 0.2126 * R + 0.7152 * G + 0.0722 * B

I read some articles: Luminance (relative), 21296247, HSL and HSV, luma, Lightness, Munsell but not found solution?

As far I know CIELab 1976 formula is near Munsell:

1.16*(Y/Ymax)^1.16*(Y/Ymax)^(1.0/3.0)-0.16 where Y/Ymax > 0.01

Or better interpolation/

1.16*(Y/Ymax)^(1.0/3.0)-0.16 where Y/Ymax > (6/29)^3
1.16*(841.0/108.0)*(Y/Ymax)+(4.0/29.0)-0.16 where Y/Ymax <= (6/29)^3

How to do such conversions?

1. HSL -> HSLum
2. HSLum -> HSL
3. HSLum -> RGB

Any hints will be welcome - algorithms suggestions.

Here is some tool doing HSLum.

Wen

Have you found algorithms to perform the given conversions? I would need HSLum to HSL conversion, but there is no final answer here... – Occupy

Answer 1

If you intend to generate and work with perceptually uniform colors you can use HSLuv, a library created by Alexei Boronine which is available in multiple programming languages.

It is based on the CIELUV colorspace and implements various color conversion routines, like rgbToHsluv, hsluvToRgb, hexToHsluv, hsluvToHex etc.

The library does not support direct conversion from HSL to HSLuv, but you can convert HSL to RGB as described here and afterwards use rgbToHsluv.

Occupy

Hi, I just tried to use HSLuv (javascript) with no success. The conversion functions are not accessible and i get "Uncaught ReferenceError: hexToHsluv is not defined", and i couldn't find anything on web about this error. Did you use this library in your work? Thanks! – Ule

@IulianAnghel: I did use this library in a test project a few years back, and it worked fine (as far as I remember). Your error suggests that you are trying to directly call hexToHsluv instead of hsluv.hexToHsluv. If this is not the case, I'd suggest you try to directly contact the developer. You can find the respective mail address on HSLuv's implementations page ( hsluv.org/implementations ). – Occupy

Hi @xpages-noob, thank you for your answer! I was calling hsluv.hexToHsluv, but for some reason it didn't work for a few days - even asked a js developer team mate to try it. I tried it the week after and it worked. I have no clue about what was wrong. Thanks again! – Ule

Answer 2

You might find this link from Charles Poynton's Gamma FAQ interesting:

'22. What are the I, B, L, and V components in HSI, HSB, HLS, and HSV?

To conform with the definition of luminance as being proportional to physical power, the I component of HSI should represent a linear-light quantity. The CIE has defined no objective measure for brightness, but it is clearly a perceptual quantity. Lightness is a perceptual quantity that has been quite precisely defined by the CIE. The CIE has not defined Value, but several different definitions are in use, such as Munsell Value, and all have a perceptual basis and are comparable to lightness.

In most formulations of HSI, HSB, HLS, and HSV used in computer graphics, the quantities are computed from R, G, and B primary components but no reference is made to the nonlinearity in the primary components, that is, the relationship of the primaries to linear light. So it is impossible to determine whether the calculated HSI, HSB, HLS, or HSV represents a physical or a perceptual quantity.

The brightness component of HSI, HSB, HLS, and HSV should be based on luminance, computed as a properly-weighted sum of red, green, and blue. But in the usual formulations, the brightness component is computed as either the maximum of the three components, or the average of the minimum and the maximum of the three. This highly nonlinear calculation introduces spokes into the hue circle.

Finally, the color produced by an RGB triple translated from HSI, HSB, HLS, or HSV depends on the chromaticity of the RGB primaries, but none of the usual formulations of HSI, HSB, HLS, or HSV takes primary chromaticity into account.

For these reasons, any use in computer graphics of I, B, L, and V quantities is suspect. For detail, see Frequently Asked Questions about Color.

I take that to mean that in all cases, you must convert to RGB to go between any of these formulations, and further that these formulations are somewhat poorly defined.

Woald

pHSL, HSL, HSV is some kind simplification for color selection - it is not good to represent colors but is vert good to design some palettes. Equal luminescence can help with balancing of colors like in Munsell scheme which focus on subjective perception. – Wen