blog/why-you-dont-need-an-icon-library

[giscus[bot]]

blog/why-you-dont-need-an-icon-library

A code-slinging Software Engineer from the Philippines who's on a quest to touch people's lives, one app at a time.

https://carlo.vercel.app/blog/why-you-dont-need-an-icon-library

[rmcsharry]

Love this guide Carlo, thanks for taking the time to share!

With the svg only version, I presume you lose the ability to pass size and classes, so less flexibility. Am I right?

[Blankeos]

Thanks for the kind words!

Actually with the svg-only version, you'd still able to pass width and height props (the usual SVGSVGElement attributes available in plain HTML). The only thing you can't do is pass custom props (e.g. variant="primary", etc.). So yeah there's definitely less flexibility.

An advantage with the svg-only version is that you're also able to view the SVG Image if your code editor supports it (via a VSCode extension or NeoVim plugin) because it's just a plain .svg file. As opposed to an svg embedded inside .svelte or .tsx files.

But to be fair, there's really no trade-off with using the svg-only version (besides an extra dependency). Since if you need custom props, just do .tsx as usual.