Great job on implementing this game changing feature. The addition of this functionality is fantastic, thank you foo doing that. It solves a number of issues but it introduces another that I think is non trivial (especially for clients who will have no idea what is happening if swatches are allowed to be left blank):
When using the var() function as the value of the color, having defined the custom property in the builder’s global css with a :root{} scope, the swatch does not populate with a color. It displays as blank, or transparent.
I appreciate that pulling in the actual hue into a preview swatch might be a programatic challenge but it is one I think needs to be tackled before calling this feature “fully implemented”. Perhaps there could be a “generate swatches from CSS variables” button that could explicitly check for the values and generate the swatches? In other words, I get that it would be hard to do this on the fly but I don’t think even that would be impossible. I mean, if I can write css and see those changes reflected immediately in the builder, Im sure the same could apply to the UI of the app itself. Do you think it is possible to get this missing piece in place? If this were in place, after some initial planning and setup, the complexities of color management would be invisible to clients while being highly maintainable by devs.
Here’s a reference image for context:
Thanks in advance!