search

RazrFalcon / resvg

An SVG rendering library.
Mozilla Public License 2.0
2.61k stars 215 forks source link

Allow setting the default `currentColor` #768

Open condemil opened 1 month ago

condemil commented 1 month ago

Most web icons, including tailwindlabs/heroicons allows to set icon color with css font color on the page/block. This is done with stroke="currentColor" on the svg icon. For now resvg allows to set background color with --background COLOR argument, it would be really nice to have an option to do the same for "foreground" color. This way it would be possible to render icons for dark backgrounds.

RazrFalcon commented 1 month ago

What do you mean by "foreground" color? currentColor is background color.

condemil commented 1 month ago

It is possible to set icon color on web, here is an example:

<div style="color: red">
    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor">
        <circle cx="12" cy="12" r="10" />
    </svg>
</div>

But resvg --background white test.svg test.png will render black circle on white background, as there is no possibility now to set the icon color similar way as it is done on web.

RazrFalcon commented 1 month ago

I understand your point now and yes it's not possible right now. We probably have to implement #277 first and then you can set color on the root element via CSS.

Unlike Web/HTML, in static SVG currentColor is resolved only inside the file itself. And while we can add an ability to set the default currentColor, it would still be rather limited compared to CSS injection.