Howto disable HSL color convertion to HEX?

[determin1st]

Hello,

I'm using mostly block functionality of LESS. Is there a way to disable hsl() color translation to hex-value?

[seven-phases-max]

No. There's no such possibility (unless you wrap all your hsl(...) with ~'hsl(...)'). The point is that the generated CSS is in general not supposed to be read by humans (except of a debugging purposes). And browsers do not care what format a color comes in (so Less outputs the shortest hex format when it's applicable).

You can write a plugin disabling the built-in hsl function (that would take about 1 or 2 lines of JS code).

[seven-phases-max]

Closing as not an issue. (Could be a generic feature-request like "preserve original color format when possible" but with very low chances so...).

[determin1st]

okay, will try ~'hsl()', i see two visible problems:

1. color animation to transparent. if i do animate HEX to TRANSPARENT, it goes GRAY at some point, that's not good.

2. dynamic color change through css variable. i dont know how it will work with hex. i could have hsl(var(--hue), var(--satur), 20%) and change hue and satur through JS code.

[seven-phases-max]

if i do animate HEX to TRANSPARENT, it goes GRAY

Hmm, hsl and hex are just different representations of the same color value - so if you have your animation working differently for that the same color value, the problem is not in the color format but elsewhere..

hsl(var(--hue), var(--satur), 20%)

Such statements are not supported in Less yet (see #2986) thus you'll have to use ~"" escaping for such statements. Essentially this problem is not in "Less converting to hex" but in "Less tries to evaluate color functions".