PHPackages thalysjuvenal/aurum-filament-theme - 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. [Utility & Helpers](/categories/utility) 4. / 5. thalysjuvenal/aurum-filament-theme ActiveLibrary[Utility & Helpers](/categories/utility) thalysjuvenal/aurum-filament-theme ================================== Aurum β€” executive gold/graphite theme plugin for FilamentPHP v5 panels v1.1.1(3d ago)88MITPHP ^8.2 Since Jul 7Compare [ Source](https://github.com/thalysjuvenal/aurum-filament-theme)[ Packagist](https://packagist.org/packages/thalysjuvenal/aurum-filament-theme)[ RSS](/packages/thalysjuvenal-aurum-filament-theme/feed)WikiDiscussions Synced today READMEChangelogDependencies (7)Versions (2)Used By (0) Aurum β€” Filament v5 Theme ========================= [](#aurum--filament-v5-theme) πŸ‡¬πŸ‡§ **English** | [πŸ‡§πŸ‡· PortuguΓͺs](https://github.com/thalysjuvenal/aurum-filament-theme/blob/main/README.pt-BR.md) **An executive gold-on-graphite theme engine and UI kit for FilamentPHP v5 panels.** [![CI](https://github.com/thalysjuvenal/aurum-filament-theme/actions/workflows/ci.yml/badge.svg)](https://github.com/thalysjuvenal/aurum-filament-theme/actions/workflows/ci.yml)[![License: MIT](https://camo.githubusercontent.com/7013272bd27ece47364536a221edb554cd69683b68a46fc0ee96881174c4214c/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f6c6963656e73652d4d49542d626c75652e737667)](https://github.com/thalysjuvenal/aurum-filament-theme/blob/main/LICENSE) [![Latest Version on Packagist](https://camo.githubusercontent.com/7a87ded4a820eab899e3c80fb7fe400ff592c630cc755f301cc54c520ddd0438/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f7468616c79736a7576656e616c2f617572756d2d66696c616d656e742d7468656d652e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/thalysjuvenal/aurum-filament-theme)[![Total Downloads](https://camo.githubusercontent.com/b9f52b89d0c10979a042930f790844fa29b94094fcd803e546518a103faa23e3/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f7468616c79736a7576656e616c2f617572756d2d66696c616d656e742d7468656d652e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/thalysjuvenal/aurum-filament-theme) Screenshots ----------- [](#screenshots) **Gold (default) β€” dashboard** Dashboard β€” darkDashboard β€” light[![Gold dashboard, dark mode](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/gold-dashboard-dark.png)](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/gold-dashboard-dark.png)[![Gold dashboard, light mode](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/gold-dashboard-light.png)](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/gold-dashboard-light.png)LoginOrders[![Login page with Aurum brand block](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/gold-login.png)](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/gold-login.png)[![Orders table](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/gold-orders.png)](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/gold-orders.png)**Presets β€” dashboard, dark and light** PresetDashboard β€” darkDashboard β€” lightEmerald[![Emerald dashboard, dark mode](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/emerald-dashboard-dark.png)](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/emerald-dashboard-dark.png)[![Emerald dashboard, light mode](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/emerald-dashboard-light.png)](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/emerald-dashboard-light.png)Sapphire[![Sapphire dashboard, dark mode](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/sapphire-dashboard-dark.png)](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/sapphire-dashboard-dark.png)[![Sapphire dashboard, light mode](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/sapphire-dashboard-light.png)](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/sapphire-dashboard-light.png)Ruby[![Ruby dashboard, dark mode](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/ruby-dashboard-dark.png)](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/ruby-dashboard-dark.png)[![Ruby dashboard, light mode](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/ruby-dashboard-light.png)](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/ruby-dashboard-light.png)Preset login screenshots are in the [Presets](#presets) section below. Features -------- [](#features) - **4 curated presets** β€” Gold (default), Emerald, Sapphire, Ruby β€” each an OKLCH 50–950 scale plus dark/light accent tokens. - **Always-dark sidebar signature** β€” the sidebar stays dark even when the panel is in light mode. - **Executive typography** β€” Instrument Sans for UI text, IBM Plex Mono with tabular figures (`.aurum-mono`) for numeric columns. - **Login brand block** β€” a configurable logo + wordmark + tagline block rendered above the auth card on login, register, and password pages. - **4 ready-made components** β€” `AurumStatsOverview`/`AurumStat`, `AurumValueList`, `Timeline`, `TotalsBlock`. - **Zero-build install** β€” the theme CSS is registered by the plugin; no Tailwind/Vite step required in the consuming app. - **Full dark + light modes**, validated end to end against a real Filament v5.6.8 application. Requirements ------------ [](#requirements) - PHP `^8.2` - `filament/filament` `^5.0` > Contributing to this package (running the test suite) requires PHP `>= 8.3` β€” see [CONTRIBUTING.md](https://github.com/thalysjuvenal/aurum-filament-theme/blob/main/CONTRIBUTING.md). Installation ------------ [](#installation) ``` composer require thalysjuvenal/aurum-filament-theme php artisan filament:assets ``` In your `PanelProvider`: ``` use ThalysJuvenal\Aurum\AurumTheme; public function panel(Panel $panel): Panel { return $panel // ... ->plugin(AurumTheme::make()); } ``` Colors, fonts, and the theme CSS are registered by the plugin, scoped to the panel it is attached to β€” panels without `->plugin(AurumTheme::make())` are left untouched. No build step is required in the consuming app. Presets ------- [](#presets) Aurum ships four color presets. Gold is the default; switch with `->preset()`: ``` use ThalysJuvenal\Aurum\AurumTheme; use ThalysJuvenal\Aurum\Presets\Sapphire; ->plugin( AurumTheme::make()->preset(Sapphire::class) ) ``` PresetLoginClassGold (default)[![Gold login](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/gold-login.png)](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/gold-login.png)`ThalysJuvenal\Aurum\Presets\Gold`Emerald[![Emerald login](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/emerald-login.png)](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/emerald-login.png)`ThalysJuvenal\Aurum\Presets\Emerald`Sapphire[![Sapphire login](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/sapphire-login.png)](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/sapphire-login.png)`ThalysJuvenal\Aurum\Presets\Sapphire`Ruby[![Ruby login](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/ruby-login.png)](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/ruby-login.png)`ThalysJuvenal\Aurum\Presets\Ruby`**Buttons, per preset (light mode)** GoldEmeraldSapphireRuby[![Gold buttons β€” solid, outlined, sizes and states](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/buttons-gold.png)](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/buttons-gold.png)[![Emerald buttons β€” solid, outlined, sizes and states](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/buttons-emerald.png)](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/buttons-emerald.png)[![Sapphire buttons β€” solid, outlined, sizes and states](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/buttons-sapphire.png)](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/buttons-sapphire.png)[![Ruby buttons β€” solid, outlined, sizes and states](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/buttons-ruby.png)](https://raw.githubusercontent.com/thalysjuvenal/aurum-filament-theme/main/art/buttons-ruby.png)All four presets pass the package's WCAG contrast gates (`tests/PresetContrastTest.php`): AA for dark-mode button text, large-text AA for light-mode button text, and a minimum 3:1 accent-on-background ratio. ### Custom presets [](#custom-presets) Extend `AurumPreset` and implement its three abstract methods β€” `name()`, `palette()` (an OKLCH 50–950 scale for `$panel->colors()`), and `accentHex()` (reference hex stops used to derive the `--aurum-*` CSS variables): ```