Flux uses the excellent Heroicons project for its icon collection. Heroicons is a set of beautiful and functional icons crafted by the fine folks at Tailwind Labs
There are four variants for each icon: outline (default), solid, mini, and micro.
Control the size (height/width) of an icon using the size-* Tailwind utility.
Flux has a special loading spinner icon that isn't part of the Heroicons collection. You can use this special icon anywhere you would normally use a standard icon.
We love Heroicons, but we acknowledge that it's a fairly limited icon set. If you need more icons, we recommend using Lucide instead.
To make it trivial to use Lucide icons, Flux provides a convenient artisan command to import them into your project:
This command will prompt you to select which icons you want to import. You can also manually specify the icons you want to import by passing in their names as arguments to the command:
For full control over your icons, you can create your own Blade files in the resources/views/flux/icon directory in your project.
You can simply paste SVG code directly into the Blade file, however we recommend using the following template structure to ensure compatibility with other components: