Slate UI Kit - Laravel Blade Component Library

Welcome to Slate UI Kit!

Slate UI Kit is a comprehensive user interface kit featuring a versatile component library built with Tailwind CSS v4, designed to provide seamless and modern UI components for creating stunning Laravel applications.

• 58 Components - Complete component library
• Zero PHP Color Logic - All colors controlled via CSS variables
• Dark Mode - Built-in dark mode support with automatic variable switching
• Accessible - WCAG 2.1 AA compliant with proper ARIA attributes
• Tailwind CSS v4 - Using latest Tailwind with CSS variables and @theme
• Anonymous Components - Pure Blade templates, no PHP classes
• Self-Contained - Everything in the package, minimal client configuration
• Alpine.js - Interactive components using Alpine.js (standard in Laravel)
• Semantic Colors - Extended semantic color system (success, warning, info, error, danger)

Get started with Slate UI Kit in minutes:

composer require electrik/slate
php artisan slate:install
npm run build

Then use components in your Blade templates:

<x-slate::button>Click me</x-slate::button>

• Getting Started - Learn the basics
• Components - Browse all 58 components
• Theming - Customize colors and styles
• Design Tokens - Complete reference of CSS variables
• Examples - Real-world usage examples
• FAQ - Frequently asked questions

• PHP 8.1+
• Laravel 10.0+ or 11.0+ or 12.0+
• Tailwind CSS v4 (required)
• Alpine.js (for interactive components)

This package is open-sourced software licensed under the MIT license.

Made with ❤️ by Electrik