PHPackages alfianm/filament-login-kit - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. [Authentication & Authorization](/categories/authentication) 4. / 5. alfianm/filament-login-kit ActiveLibrary[Authentication & Authorization](/categories/authentication) alfianm/filament-login-kit ========================== Beautiful, customizable login layouts for Filament v3, v4, and v5 v1.1.0(1mo ago)010MITPHPPHP ^8.1 Since Mar 10Pushed 1mo agoCompare [ Source](https://github.com/alfianm/filament-login-kit)[ Packagist](https://packagist.org/packages/alfianm/filament-login-kit)[ RSS](/packages/alfianm-filament-login-kit/feed)WikiDiscussions main Synced 1mo ago READMEChangelogDependencies (7)Versions (3)Used By (0) Filament Login Kit ================== [](#filament-login-kit) Beautiful, customizable login layouts for **Filament v3, v4, and v5**. Transform your login page with split layouts, overlays, and flexible positioning. [![Filament Login Kit Preview](https://raw.githubusercontent.com/alfianm/filament-login-kit/main/preview.png)](https://raw.githubusercontent.com/alfianm/filament-login-kit/main/preview.png) ✨ Features ---------- [](#-features) - 🎨 **Multiple Layouts**: Split (2-column) and Overlay (full background) modes - 📐 **Flexible Positioning**: Image left/right, form top/center/bottom - 🎯 **Background Control**: Position, size, and overlay opacity - 📱 **Responsive**: Mobile-first design - 🌙 **Dark Mode**: Automatic dark mode support - ⚡ **Zero Build**: Works without npm/yarn - 🔧 **Easy Config**: Simple method chaining - 🔄 **Multi-Version**: Supports Filament v3, v4, and v5 - 🚀 **Laravel 13 Compatible**: Tested and working with Laravel 13 - 🐘 **PHP 8.3 Support**: Fully compatible with PHP 8.3 📦 Installation -------------- [](#-installation) ``` composer require alfianm/filament-login-kit ``` ### Requirements [](#requirements) Filament VersionPHP VersionPackage Versionv3.x^8.1^1.0v4.x^8.2^1.0v5.x^8.2^1.0🚀 Quick Start ------------- [](#-quick-start) Add to your Panel Provider: ``` use AlfianM\FilamentLoginKit\LoginKitPlugin; public function panel(Panel $panel): Panel { return $panel ->plugins([ LoginKitPlugin::make(), ]); } ``` 🎨 Layout Examples ----------------- [](#-layout-examples) ### Split Layout (Default) [](#split-layout-default) ``` LoginKitPlugin::make() ->sideImage(asset('images/login-bg.jpg')) ->sideImagePosition('left') // or 'right' ``` ### Overlay Layout [](#overlay-layout) ``` LoginKitPlugin::make() ->layoutMode('overlay') ->sideImage(asset('images/background.jpg')) ->overlayOpacity(0.6) ``` ### Complete Customization [](#complete-customization) ``` LoginKitPlugin::make() ->sideImage(asset('images/office.jpg')) ->sideImagePosition('right') ->backgroundPosition('top') ->formPosition('center') ->formAlignment('left') ->heading('Welcome Back') ->subheading('Sign in to continue'), ``` 📚 Configuration Options ----------------------- [](#-configuration-options) MethodDescriptionDefault`sideImage()`Background image URL`asset('images/login-kit/side-image.jpg')``sideImagePosition()``'left'` or `'right'``'left'``backgroundPosition()`CSS position value`'center'``backgroundSize()``'cover'`, `'contain'`, etc`'cover'``formPosition()``'center'`, `'top'`, `'bottom'``'center'``formAlignment()``'left'`, `'center'`, `'right'``'center'``layoutMode()``'split'` or `'overlay'``'split'``overlayOpacity()``0.0` to `1.0``0.5``heading()`Custom heading`'Sign in'``subheading()`Custom subheading`null`🔧 Version Compatibility ----------------------- [](#-version-compatibility) ### Filament v3 [](#filament-v3) ``` // app/Providers/Filament/AdminPanelProvider.php use AlfianM\FilamentLoginKit\LoginKitPlugin; public function panel(Panel $panel): Panel { return $panel ->plugins([ LoginKitPlugin::make() ->sideImage(asset('images/login-v3.jpg')) ->sideImagePosition('left'), ]); } ``` ### Filament v4 [](#filament-v4) ``` // app/Providers/Filament/AdminPanelProvider.php use AlfianM\FilamentLoginKit\LoginKitPlugin; public function panel(Panel $panel): Panel { return $panel ->plugins([ LoginKitPlugin::make() ->sideImage(asset('images/login-v4.jpg')) ->layoutMode('split'), ]); } ``` ### Filament v5 [](#filament-v5) ``` // app/Providers/Filament/AdminPanelProvider.php use AlfianM\FilamentLoginKit\LoginKitPlugin; public function panel(Panel $panel): Panel { return $panel ->plugins([ LoginKitPlugin::make() ->sideImage(asset('images/login-v5.jpg')) ->layoutMode('overlay') ->overlayOpacity(0.6), ]); } ``` 📁 File Structure ---------------- [](#-file-structure) Place your login background image at: ``` public/images/login-kit/side-image.jpg ``` 🔧 Publishing Assets ------------------- [](#-publishing-assets) ### Views [](#views) ``` php artisan vendor:publish --tag=filament-login-kit-views ``` ### Config [](#config) ``` php artisan vendor:publish --tag=filament-login-kit-config ``` 🎨 Customization Examples ------------------------ [](#-customization-examples) ### Different Images for Different Versions [](#different-images-for-different-versions) ``` LoginKitPlugin::make() ->sideImage(match(LoginKitServiceProvider::getFilamentVersion()) { '3' => asset('images/login-v3.jpg'), '4' => asset('images/login-v4.jpg'), default => asset('images/login-v5.jpg'), }), ``` ### Mobile-Optimized Layout [](#mobile-optimized-layout) ``` LoginKitPlugin::make() ->layoutMode('split') ->formPosition('center') ->backgroundPosition('center top'), ``` ### Dark Theme Optimized [](#dark-theme-optimized) ``` LoginKitPlugin::make() ->layoutMode('overlay') ->overlayOpacity(0.7) ->sideImage(asset('images/dark-bg.jpg')), ``` 🐛 Troubleshooting ----------------- [](#-troubleshooting) ### Version Detection Issues [](#version-detection-issues) If the plugin doesn't detect your Filament version correctly, you can force it: ``` // In config/login-kit.php 'force_version' => '5', // or '4', '3' ``` ### Views Not Loading [](#views-not-loading) Clear the view cache: ``` php artisan view:clear ``` ### CSS Not Applied [](#css-not-applied) Make sure you're extending the correct layout: ``` protected static string $layout = 'filament-login-kit::components.layout.login'; ``` 📝 Changelog ----------- [](#-changelog) See [CHANGELOG.md](CHANGELOG.md) for detailed changes. 🤝 Contributing -------------- [](#-contributing) Contributions are welcome! Please see [CONTRIBUTING.md](CONTRIBUTING.md) for details. 📄 License --------- [](#-license) MIT License. See [LICENSE](LICENSE) for details. 🙏 Credits --------- [](#-credits) Created with ❤️ for the Filament community. 🔗 Links ------- [](#-links) - [Documentation](https://github.com/alfianm/filament-login-kit/wiki) - [Report Issues](https://github.com/alfianm/filament-login-kit/issues) - [Releases](https://github.com/alfianm/filament-login-kit/releases) ### Health Score 38 — LowBetter than 85% of packages Maintenance89 Actively maintained with recent releases Popularity7 Limited adoption so far Community6 Small or concentrated contributor base Maturity43 Maturing project, gaining track record Bus Factor1 Top contributor holds 100% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~10 days Total 2 Last Release 53d ago ### Community Maintainers ![](https://www.gravatar.com/avatar/c2ba4bb8ff1a2a6e6f36bbc4ba587cb86a34b3ec0bf8cf1ed4af7bfca9f2fa86?d=identicon)[alfianm](/maintainers/alfianm) --- Top Contributors [![apin1411](https://avatars.githubusercontent.com/u/50357438?v=4)](https://github.com/apin1411 "apin1411 (3 commits)") --- Tags laravelauthloginfilamentfilament-pluginfilament-v5filament-v4filament-v3split-loginoverlay-login ### Code Quality TestsPest Code StyleLaravel Pint ### Embed Badge ![Health badge](/badges/alfianm-filament-login-kit/health.svg) ``` [![Health](https://phpackages.com/badges/alfianm-filament-login-kit/health.svg)](https://phpackages.com/packages/alfianm-filament-login-kit) ``` ### Alternatives [bezhansalleh/filament-shield Filament support for `spatie/laravel-permission`. 2.8k2.9M88](/packages/bezhansalleh-filament-shield)[andrewdwallo/filament-companies A comprehensive Laravel authentication and authorization system designed for Filament, focusing on multi-tenant company management. 34450.0k2](/packages/andrewdwallo-filament-companies)[diogogpinto/filament-auth-ui-enhancer This Filament plugin empowers you to transform your auth pages with ease, allowing you to make them truly stand out. It offers a flexible alternative to the default auth pages in the Filament Panels package. 13493.9k6](/packages/diogogpinto-filament-auth-ui-enhancer)[stephenjude/filament-two-factor-authentication Filament Two Factor Authentication: Google 2FA + Passkey Authentication 81158.7k4](/packages/stephenjude-filament-two-factor-authentication)[marcelweidum/filament-passkeys Use passkeys in your filamentphp app 5925.8k](/packages/marcelweidum-filament-passkeys)[caresome/filament-auth-designer Transform Filament's default auth pages into stunning, brand-ready experiences 3916.8k2](/packages/caresome-filament-auth-designer) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)