6 Laravel UI Kits and Component Libraries for 2025
The Laravel ecosystem offers a rich selection of Blade UI component libraries. This article reviews six of the most popular options, showing how to install each one and swap it into a real login form built with the Livewire starter kit and Tailwind v4.
The baseline is the default login form that ships with the Livewire starter kit, which uses Flux components (<flux:input>, <flux:button>, etc.). Each section below replaces those Flux components with the library under review.
1. Flowbite
Flowbite is a Tailwind-based component library. You install it via npm and register it as a plugin in app.css.
npm install flowbite --save
/* resources/css/app.css */
@import 'tailwindcss';
@import 'flowbite/src/themes/default';
@plugin 'flowbite/plugin';
@source '../../node_modules/flowbite';
You then create plain Blade components (button, input, label) and paste the Flowbite utility classes into each one. Because the classes live in your own components, you keep full control over markup.
2. daisyUI
daisyUI adds semantic class names on top of Tailwind—similar in spirit to Bootstrap. A button becomes btn btn-outline btn-primary; an input becomes input input-bordered w-full.
npm i -D daisyui@latest
/* resources/css/app.css */
@import 'tailwindcss';
@plugin 'daisyui';
Blade components are still hand-crafted, but the class strings are much shorter than raw Tailwind utilities.
3. Preline
Preline ships utility-class snippets plus JavaScript plugins for interactive components. It requires @tailwindcss/forms as a peer dependency.
npm install preline
npm install -D @tailwindcss/forms
@import "../../node_modules/preline/variants.css";
@plugin '@tailwindcss/forms';
@source "../../node_modules/preline/dist/*.js";
Preline also provides ready-made page examples and plugins for dropdowns, modals, and more.
4. maryUI
maryUI is purpose-built for Livewire and uses daisyUI under the hood. Installation is a single composer command.
composer require robsontenorio/mary
php artisan mary:install
Components use the x-mary-* prefix (<x-mary-input>, <x-mary-button>), and they accept the same wire:model attributes as Flux components, making migration straightforward.
5. Sheaf UI
Sheaf UI is powered by Livewire, Alpine.js, and Tailwind CSS. Components are published individually via Artisan, so you only ship what you use.
composer require sheaf/cli
php artisan sheaf:init
php artisan sheaf:install button
php artisan sheaf:install input
php artisan sheaf:install field
Components live under the x-ui.* namespace (<x-ui.field>, <x-ui.input>, <x-ui.button>). The field wrapper component handles label, input, and error display together.
6. TallStackUI
TallStackUI targets the full TALL stack (Tailwind, Alpine, Livewire, Laravel). Install via composer and add its script tag to your layout.
composer require tallstackui/tallstackui:^2.0.0
{{-- resources/views/partials/head.blade.php --}}
<tallstackui:script />
@import '../../vendor/tallstackui/tallstackui/css/v4.css';
@plugin '@tailwindcss/forms';
@source '../../vendor/tallstackui/tallstackui/**/*.php';
Components use generic names (<x-input>, <x-button>, <x-checkbox>, <x-link>) with props like color, submit, and xs for sizing.
Key Takeaways
- Flowbite & Preline are CSS/JS class libraries—you write your own Blade components and apply their utility classes.
- daisyUI provides semantic shorthand classes that sit on top of Tailwind, reducing verbose class strings.
- maryUI is the most Livewire-native option and installs with a single
php artisan mary:install. - Sheaf UI lets you publish only the components you need, keeping your project lean.
- TallStackUI covers the widest component surface for TALL-stack projects and ships its own CSS for Tailwind v4.
- All six libraries are compatible with Tailwind v4 and the Livewire starter kit as of 2025.
Source: 6 Laravel UI Kits and Component Libraries: 2025 Version
