This makes me want to write a post about the rabbit hole that is icon optimisation. It drives me insane when websites suffer from layout shift simply because they are not inlining their icons, for one.
I agree with your comment, it is often an overlooked topic.
Inlining icons can be one answer but be aware of the growing size of your DOM. Depending on the complexity, number and repetition of the icons you are using, an approach including lazy loading can be better.
Layout shift is first and foremost caused by an improper space reservation.
https://www.svgrepo.com
I find the site very user friendly as it lets you customize the stroke's width, color etc, see how it looks like and copy the modified version.
This site shows up on google a lot but it's a bit sketchy that there isn't a link to the source / license text. Not to mention the SEO optimized descriptions.
> Free Download Wallet 460 SVG vector file in monocolor and multicolor type for Sketch and Figma from Wallet 460 Vectors svg vector
Plus I've found the license listed isn't always accurate (eg applies to a different collection of similar name)
Honestly, I always default to material icons unless a project calls for a very specific style. The coverage is just so dang good I rarely find a scenario without an appropriate icon and the style is neutral enough to blend in with a number of UI designs.
I used them for my offline text editor, the result turned wonderful (icons wise)
https://wrifocus.bounded.cc
September 2024 (4 comments, 17 points): https://news.ycombinator.com/item?id=41615563
Most of my Websites/Apps don't use rasterized graphics for design anymore, SVG + CSS gradients/backgrounds & effects seem to handle everything I need.
But other than that, I also usually default to Material UI Icons.
> Free Download Wallet 460 SVG vector file in monocolor and multicolor type for Sketch and Figma from Wallet 460 Vectors svg vector
Plus I've found the license listed isn't always accurate (eg applies to a different collection of similar name)
https://www.flaticon.com/
Not a deal-breaker entirely, but for my own things I like differentiate.
Most users will not care if they have seen a map icon in another app before anyway.