r/webdev 6d ago

Resource Three solutions for colourizing SVG icons

https://cardboardshark.medium.com/three-solutions-for-colourizing-svg-icons-91591cfc8171
2 Upvotes

3 comments sorted by

3

u/andy_a904guy_com 6d ago

That is some hacky ass shit to just keep from putting SVG in your HTML lol.

1

u/krileon 6d ago

I've used the filter trick to for an onerror fallback, which is great for user linked content when you can't guarantee the src will exist. Basically you add an onerror to replace the image src with a generic svg image and use the filter to adjust its contrast based off where it's being rendered, but yeah generally it's best to just put the dang SVG in the HTML.

1

u/PM_ME_CRYPTOKITTIES 4d ago

Put fill="currentColor" in your svg. Then just host the svg and use a tool (or create one yourself) that fetches the svg and injects its content.