schaefersoft/laravel-headless-ui

Laravel HeadlessUI

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.

Requirements

• PHP 8.2+
• Laravel 10, 11, 12, or 13

Installation

composer require schaefersoft/laravel-headless-ui

The package auto-discovers its service provider. No manual registration needed.

Setup

Import the required CSS and JS assets in your application.

CSS

@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);

JS

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'

Option 3: Minified, without a bundler

Copy dist/js/hui.min.js to your public directory and load it directly in the browser.

<script type="module" src="/js/hui.min.js"></script>

Components

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