Tabler Icons

Kompass ships with Tabler Icons through the secondnetwork/blade-tabler-icons package. Every Tabler icon is available as a Blade component, so you can use the same icon set Kompass uses for its own admin UI.

A package to easily make use of tabler-icons in your Laravel Blade views.

Blade Icons

Blade tabler-icons uses Blade Icons under the hood. Please refer to the Blade Icons readme for additional functionality. We also recommend to enable icon caching with this library.

Configuration

Blade tabler-icons also offers the ability to use features from Blade Icons like default classes, default attributes, etc. If you'd like to configure these, publish the blade-tabler-icons.php config file:

php artisan vendor:publish --tag=blade-tabler-icons-config

Usage

Icons can be used a self-closing Blade components which will be compiled to SVG icons:

<x-tabler-alert-circle />

You can also pass classes to your icon components:

<x-tabler-alert-circle class="w-6 h-6 text-gray-500"/>

And even use inline styles:

<x-tabler-alert-circle style="stroke-width: 1.25"/>

Or into...

@svg('tabler-alert-circle', 'w-6 h-6')

The filled icons can be referenced like this:

<x-tabler-alert-circle-filled />

Or

<x-tabler-alert-circle-f />

Raw SVG Icons

If you want to use the raw SVG icons as assets, you can publish them using:

php artisan vendor:publish --tag=blade-tabler-icons --force

Then use them in your views like:

<img src="{{ asset('vendor/blade-tabler-icons/alert-circle.svg') }}" width="10" height="10"/>