Support var when resolving colors

linebender / resvg

An SVG rendering library.

Apache License 2.0

2.85k stars 228 forks source link

Support var when resolving colors #821

Open LaurenzV opened 2 months ago

LaurenzV commented 2 months ago

See here: https://developer.mozilla.org/en-US/docs/Web/CSS/var

Reason I want this is that the SVG OpenType spec allows reference CPAL palettes via vars. They way this should probably work is that the user can optionally provide a callback function that receives a string and then optionally returns a color.

LaurenzV commented 2 months ago

Thinking about it a bit more though, implementing this properly would probably require full-blown support for resolving variables in resvg (including its dependencies), so I guess this won't happen for a while...

RazrFalcon commented 2 months ago

This should be implemented in simplecss first. And yes, I have no plans on working on it. Or any other features to begin with. So patches are welcome.

Caellian commented 3 weeks ago

Thinking about it a bit more though, implementing this properly would probably require full-blown support for resolving variables in resvg (including its dependencies), so I guess this won't happen for a while...

Tbh, just having a way to define color variables (even without fallback) would be nice. It would greatly simplify cases like svg icon rasterization in programs where the colors might have to change.

e.g. if you want to animate icon button color on hover, currently you have to:

render icon as a mask and pass it through a fragment shader which modifies the color each frame
- annoying if you want to use multiple colors in icons
- doesn't handle gradients well (it can but it's very tricky)
parse the same SVG file every frame with changed color values
- bad performance

Caellian commented 3 weeks ago

I'm waiting for feedback, but yeah, after delving into this a bit, it seems like it requires a lot of breaking changes to most CSS related dependencies. It also complicates code a lot because none of these crates expect values to change after initial parsing.

EDIT: CSS variable support isn't part of SVG specification. So if you use stroke="var(--color, red)" in an SVG file, only when opened with a browser will it display as you'd expect, other rasterizers (tried feh (librsvg)) and programs (tried inkscape) will assume the stroke color to be invalid.

However, this feature would be very useful when integrating resvg into other programs so it might be worth implementing.