facelessuser / ColorHelper

Sublime plugin that provides helpful color previews and tooltips
https://facelessuser.github.io/ColorHelper/
MIT License
253 stars 29 forks source link

Support Relative Color Syntax #241

Open facelessuser opened 1 year ago

facelessuser commented 1 year ago

Color Level 5 introduces a new Relative Color Syntax (RCS). This takes the existing color formats and allows you to do something like:

rgb(from <some-other-color> r g b)

In addition, the r, g, and b could be replaced with actual numbers or percentages, basically valid CSS values for that color format.

rgb(from red r 255 b / 50%)

Even more, you can add calc() to the mix and make calculations on those channels, calc(r * 0.3) etc.

rgb(from  red calc(r * 0.3) 255 b / 50%)

Is this a bit of work? Yep. But doable. One thing that's a little tricky is that we have to mimic calc(). This is probably the biggest piece of work we have to go through as we need to pretty much match whatever JS does. This means we need to figure out all the corner cases of calc() and implement them here. Everything else is no more difficult than when we implemented Sublime's Color Mod functions.

There is no rush to implement this right now, but it does need to be considered in the future. Color Level 4 isn't even fully rolled out yet in the real world.

This of course will be a bit of a pain to implement as it makes color parsing for this plugin even more complicated. We most likely will be waiting quite a bit before this becomes mainstream enough to implement, but we'll see. It'll also require a good bit of time to be carved out to implement.

facelessuser commented 2 months ago

It is difficult to tell if/when this will get implemented. There is still things in flux with this. It will be a lot of work though and require us to do a wrapper to pull it off. I am unlikely to implement it down at the ColorAide level. ColorAide is meant to handle colors, and will read CSS syntax for colors, but not necessarily CSS manipulation of colors. Much like how we implemented Sublimes color() function and blend() stuff, there would be a layer above.