PHPackages suraj-kashyap-dev/vesper - 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. suraj-kashyap-dev/vesper ActiveLibrary[Utility & Helpers](/categories/utility) suraj-kashyap-dev/vesper ======================== Vesper is a Filament theme plugin by Suraj Kashyap v2.0.0(1mo ago)110↓87.5%MITPHPPHP ^8.3 Since Jun 7Pushed 1mo agoCompare [ Source](https://github.com/suraj-kashyap-dev/vesper)[ Packagist](https://packagist.org/packages/suraj-kashyap-dev/vesper)[ RSS](/packages/suraj-kashyap-dev-vesper/feed)WikiDiscussions main Synced 1w ago READMEChangelog (2)Dependencies (28)Versions (3)Used By (0) Vesper ====== [](#vesper) [![Latest Version on Packagist](https://camo.githubusercontent.com/1e23cd1e6f45ab300ef96bead83417fad1c89a224fb51ee6662379052317e575/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f737572616a2d6b6173687961702d6465762f7665737065722e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/suraj-kashyap-dev/vesper)[![Total Downloads](https://camo.githubusercontent.com/3200148b689256a5c5ecbe396f1dbc270979a16802a3920756cfebabece76ae6/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f737572616a2d6b6173687961702d6465762f7665737065722e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/suraj-kashyap-dev/vesper)[![License](https://camo.githubusercontent.com/309b4084647ca65ba75427271e51d0d4b4564ae530c0a1b3127c71a18dc1aced/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f6c2f737572616a2d6b6173687961702d6465762f7665737065722e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/suraj-kashyap-dev/vesper)[![PHP Version](https://camo.githubusercontent.com/f728f051c5db855700a227f373625b8c6c4887ac0b10a3a7ecae3fe3fb35e318/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f7068702d762f737572616a2d6b6173687961702d6465762f7665737065722e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/suraj-kashyap-dev/vesper) Vesper is a Composer-installable Filament 5 theme plugin with premium-style runtime customization. It supports preset-driven palettes, semantic Filament colors, runtime CSS token overrides, configurable layout behavior, and package-owned Blade overrides for the shell. The package is published on Packagist: **[suraj-kashyap-dev/vesper](https://packagist.org/packages/suraj-kashyap-dev/vesper)**. Install ------- [](#install) ``` composer require suraj-kashyap-dev/vesper ``` Register the plugin on your panel provider — every preset and design token ships inside the package, so there is no config to publish: ``` use Kashyap\Vesper\Enums\ThemePreset; use Kashyap\Vesper\VesperPlugin; $panel->plugin( VesperPlugin::make() ->preset(ThemePreset::Sunset), ); ``` What You Can Customize ---------------------- [](#what-you-can-customize) - Preset theme palette: `emerald`, `sunset`, `amethyst`, `burgundy`, `champagne`, `obsidian`, `platinum`, `sapphire` - Semantic Filament colors: `primary`, `success`, `warning`, `danger`, `info`, `gray` - Runtime CSS tokens for light and dark surfaces, accent colors, gradients, shadows, radii, and typography variables - Shell sizing tokens for dropdown widths, search widths, control radii, avatars, and panel chrome - Layout behavior: default theme mode, sidebar widths, collapsibility, search shortcuts, debounce, and content widths - Font loading: use the default Google font stylesheet, swap it for your own, or set it to `null` - Header actions: help URL (with an enable/disable toggle) and theme-toggle visibility - Branding copy: name, eyebrow, mark - Sidebar fallback labels and role label Configuring The Plugin ---------------------- [](#configuring-the-plugin) Configure everything fluently on the plugin instance: ``` use Filament\Enums\ThemeMode; use Filament\Support\Enums\Width; use Kashyap\Vesper\Enums\ThemePreset; use Kashyap\Vesper\VesperPlugin; $panel->plugin( VesperPlugin::make() ->preset(ThemePreset::Emerald) ->branding(name: 'Acme', eyebrow: 'Acme Admin', mark: 'AC') ->header(helpUrl: 'https://example.com/docs', showHelpUrl: true, showThemeToggle: true) ->sidebar(overviewLabel: 'Overview', userRole: 'Owner') ->fonts( body: "'Instrument Sans', sans-serif", mono: "'JetBrains Mono', monospace", heading: "'Sora', sans-serif", ) ->colors([ 'primary' => 'teal', 'info' => 'sky', ]) ->tokens([ 'shared' => [ 'vs-control-radius' => '999px', 'vs-user-menu-width' => '18rem', 'vs-brand-gradient-end' => '#123456', ], 'light' => ['vs-surface-2' => '#eefbf5'], 'dark' => ['vs-surface-3' => '#173328'], ]) ->layout([ 'default_theme_mode' => ThemeMode::System, 'sidebar_width' => '17rem', 'global_search_key_bindings' => ['mod+k', 'ctrl+/'], 'max_content_width' => Width::SevenExtraLarge, ]), ); ``` To hide the header help link entirely, pass `->header(showHelpUrl: false)` (or simply omit the `helpUrl`). ### Registering A Custom Preset [](#registering-a-custom-preset) Presets are first-class classes. Implement `Kashyap\Vesper\Theme\Contracts\Preset` — or extend `AbstractPreset` to inherit the shared foundation tokens — then register it: ``` use Kashyap\Vesper\Theme\Presets\AbstractPreset; use Kashyap\Vesper\VesperPlugin; class MidnightPreset extends AbstractPreset { public function key(): string { return 'midnight'; } public function colors(): array { return ['primary' => 'indigo', 'gray' => 'slate']; } protected function paletteTokens(): array { return [ 'shared' => ['vs-accent' => '#6366f1', 'vs-accent-strong' => '#4f46e5'], 'dark' => ['vs-accent-2' => '#a5b4fc'], ]; } } $panel->plugin( VesperPlugin::make() ->registerPreset(new MidnightPreset) ->preset('midnight'), ); ``` ### Optional config fallback [](#optional-config-fallback) Publishing the config file remains optional and purely additive — fluent plugin calls win over it: ``` php artisan vendor:publish --tag="vesper-config" ``` Useful Token Names ------------------ [](#useful-token-names) - Shared: `vs-control-radius`, `vs-kbd-radius`, `vs-radius-pill`, `vs-search-width`, `vs-search-width-focus`, `vs-dropdown-width`, `vs-user-menu-width`, `vs-notifications-width`, `vs-user-avatar-size`, `vs-user-avatar-lg-size` - Shared: `vs-accent`, `vs-accent-strong`, `vs-accent-soft`, `vs-accent-glow`, `vs-success`, `vs-warning`, `vs-danger`, `vs-brand-gradient-start`, `vs-brand-gradient-end`, `vs-avatar-gradient-start`, `vs-avatar-gradient-end` - Light: `vs-bg`, `vs-surface-1`, `vs-surface-2`, `vs-surface-3`, `vs-surface-4`, `vs-border`, `vs-border-strong`, `vs-shadow`, `vs-shadow-soft`, `vs-panel-highlight-border` - Dark: `vs-bg`, `vs-surface-1`, `vs-surface-2`, `vs-surface-3`, `vs-surface-4`, `vs-border`, `vs-border-strong`, `vs-shadow`, `vs-shadow-soft`, `vs-panel-highlight-border` Presets ------- [](#presets) Selected with `->preset(ThemePreset::Sapphire)` (or the string key): - `sapphire`: cool blue default - `emerald`: green/teal shell - `sunset`: warm orange/coral shell - `amethyst`: violet/pink shell - `burgundy`: deep wine/rose shell - `champagne`: warm gold shell - `obsidian`: neutral zinc shell - `platinum`: cool slate shell Build ----- [](#build) From the package directory: ``` npm install npm run build ``` That rebuilds `dist/vesper.css` and republishes the package asset for local app testing. Docs ---- [](#docs) - `docs/README.md` contains the package map. - `docs/config-reference.md` documents the config surface in detail. - `docs/files/*.md` contains file-level runtime docs. Verification ------------ [](#verification) For the local app in this repository: ``` php artisan test tests/Filament/Pages/TopbarOverrideTest.php php artisan test tests/Filament/Pages/ThemeCustomizationTest.php ``` ### Health Score 41 — FairBetter than 87% of packages Maintenance91 Actively maintained with recent releases Popularity7 Limited adoption so far Community6 Small or concentrated contributor base Maturity50 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 ~1 days Total 2 Last Release 45d ago Major Versions v1.0.0 → v2.0.02026-06-09 ### Community Maintainers ![](https://avatars.githubusercontent.com/u/69279728?v=4)[Suraj Kashyap](/maintainers/suraj-kashyap-dev)[@suraj-kashyap-dev](https://github.com/suraj-kashyap-dev) --- Top Contributors [![suraj-kashyap-dev](https://avatars.githubusercontent.com/u/69279728?v=4)](https://github.com/suraj-kashyap-dev "suraj-kashyap-dev (5 commits)") --- Tags phplaravelthemefilamentfilamentphpfilament-themevesper ### Code Quality TestsPest Static AnalysisPHPStan Code StyleLaravel Pint ### Embed Badge ![Health badge](/badges/suraj-kashyap-dev-vesper/health.svg) ``` [![Health](https://phpackages.com/badges/suraj-kashyap-dev-vesper/health.svg)](https://phpackages.com/packages/suraj-kashyap-dev-vesper) ``` ### Alternatives [rawilk/profile-filament-plugin Profile & MFA starter kit for filament. 3914.8k](/packages/rawilk-profile-filament-plugin)[stephenjude/filament-jetstream A Laravel starter kit built with Filament inspired by Jetstream. 17760.2k3](/packages/stephenjude-filament-jetstream)[codewithdennis/filament-select-tree The multi-level select field enables you to make single selections from a predefined list of options that are organized into multiple levels or depths. 330530.5k30](/packages/codewithdennis-filament-select-tree)[dotswan/filament-map-picker Easily pick and retrieve geo-coordinates using a map-based interface in your Filament applications. 128192.3k3](/packages/dotswan-filament-map-picker)[stephenjude/filament-debugger About 104162.2k2](/packages/stephenjude-filament-debugger)[tapp/filament-google-autocomplete-field Filament plugin that provides a Google Autocomplete field 30136.4k](/packages/tapp-filament-google-autocomplete-field) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)