Under the Hood
The story begins when I want to find the icon library.
Frontend Roadmap Template || Ultimate Frontend Toolkit
GPT helps me to get the list, but again some links won’t work and not all good resources are covered by GPT itself.
Here we go with 20 icon libraries and links
- BoxIcons
- Google Fonts
- Lucide
- Material Icons
- Phosphor Icons
- Ionicons
- Feather
- Glyphicons
- React Icons
- Radix Icons
- CSS.gg
- Font Awesome
- Flaticon
- Freepik
- Fontastic
- Heroicons
- Iconfactory
- Icons8
- Icontre
- Iconjar
- IconFinder
- Iconshock
- Iconmonstr
- Ionicons
- Icomoon
- Pngtree
- Swift Icons
- UXWing
I’ve added the same list in the Frontend roadmap template this will certainly help a lot of developers, it has made 100+ sales in 50 countries.
Frontend roadmap template || Ultimate Frontend Toolkit
This same template has other resources as mentioned below, so give it a shot.
- Maps
- Icons
- Cookies
- Frameworks
- PDF Libraries
- Animation Libraries
- Video and Audio
- Authentication Libraries
- Payment Frontend Libraries
- Image Libraries
Well, this blog should be short so won’t make it boring.
I am bringing a lot of frontend tools, frameworks, resources, and links into one place making it easy for devs to check it out. In addition, we have a weekly newsletter on programming, technology, frontend and backend named iHateReading newsletter, feel free to subscribe to it, it’s FREE.
Subscribe - www.ihatereading.in/subscribe
Newsletter — www.ihatereading.in/newsletter
Until next time, have a good day
Shrey
Top comments (14)
Thank you :)
more icons:=>
fonts.google.com/icons
phosphoricons.com/
I've added this entire list on the website, will update your icon over there as well, ihatereading.in/t/gZvMKem2SWSorcSl...
Nice article!
Also React Icons have a 30+ icons dataset in one place.
React-icons are not good enough to be used. We may face difficulties while production.
yeah, but i personally have some problem with react-icons their SVGs are not that good for production based app
Hmm, but I guess you missed the greatest of all library ---Lucide, which is compatible for various technologies like nextjs, buejs, solid, svelte and many others. I have written a detailed article on it. Check it out dev.to/sheraz4194/unleashing-the-p...
Added, thanks for the recommendation
Thanks for sharing this 🫡
Great 👍 Resources
👍
Thank you. This is also a great link for icons
iconify.design/
is there a way to add to react app or something a icon picker ?
Yep, you can. With Lucide you can add icons to a variety of frameworks. Check this article, it explains how to add lucide icons in reactjs or nextjs app.
dev.to/sheraz4194/unleashing-the-p...
import the icon exported from the libraries mentioned above, then use any UI library Icon as a wrapper and render the icon or import SVG in react app
Some comments may only be visible to logged-in visitors. Sign in to view all comments.