Laravel Blade UI Kit

A simple UI kit for Laravel. Based on Tailwind and AlpineJS.

Installation

You can install the package via composer:

composer require elegantly/blade-kit

To make it work with tailwindcss v4, you must add the following lines to your app.css.

@import "../../vendor/elegantly/blade-kit/theme.css";
@source "../../vendor/elegantly/blade-kit/resources/views/**/*.blade.php";
@source "../../vendor/elegantly/blade-kit/src/Ui/**/*.php";

You can publish the config file with:

php artisan vendor:publish --tag="blade-kit-config"

This is the contents of the published config file:

use Elegantly\Kit\Ui\Base;
use Elegantly\Kit\Ui\Button;
use Elegantly\Kit\Ui\Input;
use Elegantly\Kit\Ui\Select;
use Elegantly\Kit\Ui\SwitchUi;
use Elegantly\Kit\Ui\Tag;

return [

    'ui' => [
        'base' => Base::class,
        'button' => Button::class,
        'input' => Input::class,
        'select' => Select::class,
        'tag' => Tag::class,
        'switch' => SwitchUi::class,
    ],

];

Optionally, you can publish the views using

php artisan vendor:publish --tag="blade-kit-views"

Usage

<x-kit::button class="rounded-md font-semibold" color="white">
    Button
</x-kit::button>

See full documentation here.

Testing

composer test

Changelog

Please see CHANGELOG for more information on what has changed recently.

Contributing

Please see CONTRIBUTING for details.

Security Vulnerabilities

Please review our security policy on how to report security vulnerabilities.

Credits

• Quentin Gabriele
• All Contributors

License

The MIT License (MIT). Please see License File for more information.