Icons
This guide explains how to use and manage icons with Iconify in your project.
✅ Applies from v7.0.0 and above.
Why change the default Iconify setup?
By default, icons from Iconify are loaded directly from their CDN/API: 🔗 Iconify documentation
While convenient, this approach has some drawbacks:
- ❌ No offline support
- ❌ Flickering and layout shift during load
To improve performance and stability, we’ve changed how icons are used in the project.
Follow the steps below to register, customize, and clean up icons effectively.
🔧 1. Register and use available icons from Iconify
You can browse and choose icons directly from Iconify icon sets.
To control and configure icons used in your project, visit: 🔗 Minimal iconify icon.
🎬 Watch the guide: Watch
🎨 2. Register and use custom icons
Need your own icon set? You can also register custom icons easily.
🎬 Watch the guide: Watch
🧹 3. Find and remove unused icons
To keep your code clean and optimized, use the following tool to detect and remove unused icons:
🎬 Watch the guide: Watch
npx find-unused-iconifynpx find-unused-iconify -d