Default iconset

All the default icons are powered by Blade Hero Icons and you can use them right away.

<x-icon name="o-envelope" />
<x-icon name="s-envelope" class="w-9 h-9 text-green-500" />
<x-icon name="o-envelope" class="w-12 h-12 bg-orange-500 text-white p-2 rounded-full" />


<x-icon name="o-envelope" label="Messages" />
<x-icon name="s-envelope" class="w-9 h-9 text-green-500 text-2xl" label="Messages" />

Alternative iconset

You can install any compatible blade iconset listed here.

Here is an example for FontAwsome and Bootstrap iconsets.

composer require owenvoke/blade-fontawesome
composer require davidhsianturi/blade-bootstrap-icons
{{-- FontAwsome variants --}}
<x-icon name="fas.cloud" />
<x-icon name="far.circle-play" />
<x-icon name="fab.facebook" />
{{-- Bootstrap --}}
<x-icon name="bi.bell-fill" />


As advised by Blade Icons docs it is a good idea to put icons on cache at the production environment.

php artisan icons:cache