Where to find free Vector/SVG icons?
When teaching design/web development, I often recommend svgrepo.com because it has a vast collection of free icons that can be used for commercial purposes.
However, for web developers using React/Next.js, I’ve found that converting icons to jsx before working with them is the most straightforward approach. Additionally, maintaining the line style and allowing users to adjust the stroke width is beneficial as it reduces icon size compared to pre-outlined icons.
Here are two recommended resources for free Vector/SVG icons:
1. Heroicons.com
Developed by the creators of Tailwind CSS, this website offers a collection of 288 aesthetically pleasing and consistent icons.
2. Lucide.dev
(Pronounced “Lu Si De” in French and “Lucid” in English, meaning “clear”)
This open-source project is a fork of the once-popular feathericons.com, which is no longer under development. Currently, lucide.dev boasts 1368 icons and an active community.
Icons can be either copied directly from the website or installed via npm. Please check npm installation instructions
UPDATED
3. Iconify.design
All popular icon sets. Over 200,000 open source vector icons.
