Overcoming hsl's lossy conversions to hex

[ryansch]

I've been working in a solarized dark variant here: https://github.com/ryansch/lunarized

After experimenting with the hsl function, it became clear to me that the conversion from hsl to the final hex that neovim uses is not exact.

Example: I specify "#002b36" as the base03 color (https://github.com/ryansch/lunarized/blob/843fc965500266649fe2778a889a8ac5b57158a6/lua/lush_theme/lunarized.lua#L58). If I wrap that color with hsl, neovim actually ends up with "#002d38".

Is this just a limitation of how hsl models the colorspace? I'd really like to be able to use the various functions in lush to generate color variants but I'd also like my colors to be accurate.

[rktjmp]

Generally, yes it's a side effect of using HSL internally. See responses to previous issues #68 #59.

That said, when I've looked at previous colors, the differences have been much smaller than your example.

Unfortunately you can see that both come out with the same HSL value of 192, 100, 11 when entering them onto https://coolors.co/002b36-002d38.

Manually tweaking the colors to https://coolors.co/012b37-002b36-002d38 looks about the same on my screen (though not exact), so you could use #012b37 (or 193, 96, 11) as your color.

You may fair better working in HSL directly though that's hard when you're working out of an existing palette like you are.

PR's welcome for any better converter but AFAIK it's just always going to be like that because the colorspaces don't map 1:1.

There is potential for a rgb(...) type that would not pass any conversion while also being unable to use the operations but I can't say if/when I would have time to do that and it would need a bit of surgery to fit.

[ryansch]

Thanks for the excellent feedback! Could you describe the process you used to manually tweak the color?

Edit: I'm wondering if I could apply the same process to the rest of the colors to get something that's really close to the original colors but works with hsl.

[rktjmp]

I just stuck the desired color and the "wrong" in coolors.co and edited wrong slice until they looked similar.

You have to click the color code → "HSL" mode → +/- a bit until they match.

[ryansch]

@rktjmp I was able to apply your strategy to rework my color palette!

https://github.com/ryansch/lunarized/blob/7b18694952c4a78e7c3765e03b5c588775e1c83a/lua/lush_theme/lunarized.lua#L57

Thanks!

[rktjmp]

Great! Check out the new BUILD.md for a guide on converting your theme for use in other programs if you want.