A collection of completely unstyled, accessible Laravel Blade UI components. Built with performance, customization and accessibility in mind. No additional JavaScript dependencies required. The best way to build data-driven UIs using traditional Blade.
- PHP 8.2+
- Laravel 10, 11, 12, or 13
composer require schaefersoft/laravel-headless-uiThe package auto-discovers its service provider. No manual registration needed.
Import the required CSS and JS assets in your application.
@import '../../vendor/schaefersoft/laravel-headless-ui/resources/css/hui.css';
/* If you are using TailwindCSS, append layer(base) */
@import '../../vendor/schaefersoft/laravel-headless-ui/resources/css/hui.css' layer(base);Option 1: Pre-built (recommended)
No TypeScript tooling needed. Works out of the box with any bundler or <script type="module">.
import '../../vendor/schaefersoft/laravel-headless-ui/dist/js/hui.js'Option 2: TypeScript source
Import the TS source directly if your project already has a TypeScript build pipeline (e.g. Vite with
laravel-vite-plugin).
import '../../vendor/schaefersoft/laravel-headless-ui/resources/js/hui.ts'All components use the x-hui:: Blade prefix and are completely unstyled. Style them with your own CSS or utility
classes.
| Component | Preview |
|---|---|
| Avatar |  |
| Combobox |  |
| Dropdown |  |
| Dialog |  |
| Disclosure |  |
| Flyout |  |
| Range slider |  |
| Tabs |  |
| Toggle |  |
| Tooltip |  |