PHPackages juniyasyos/dash-stack-theme-juniyasyos - 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. [Templating & Views](/categories/templating) 4. / 5. juniyasyos/dash-stack-theme-juniyasyos ActiveLibrary[Templating & Views](/categories/templating) juniyasyos/dash-stack-theme-juniyasyos ====================================== DashStack theme for filament php v1.3.3(9mo ago)07151MITCSSPHP ^8.2 Since Mar 15Pushed 9mo agoCompare [ Source](https://github.com/juniyasyos/dash-stack-theme)[ Packagist](https://packagist.org/packages/juniyasyos/dash-stack-theme-juniyasyos)[ GitHub Sponsors](https://github.com/Fa-BRAIK)[ RSS](/packages/juniyasyos-dash-stack-theme-juniyasyos/feed)WikiDiscussions my-package Synced 1mo ago READMEChangelog (8)Dependencies (6)Versions (10)Used By (1) FilamentPHP DashStack Theme =========================== [](#filamentphp-dashstack-theme) [![GitHub License](https://camo.githubusercontent.com/be22a47b16704bf45647413d746ca171c6170b683b278bce094f2581dc709e5f/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f6c6963656e73652f46612d425241494b2f646173682d737461636b2d7468656d652d6a756e69796173796f73)](https://camo.githubusercontent.com/be22a47b16704bf45647413d746ca171c6170b683b278bce094f2581dc709e5f/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f6c6963656e73652f46612d425241494b2f646173682d737461636b2d7468656d652d6a756e69796173796f73)[![Packagist Version](https://camo.githubusercontent.com/c0289749f5767de1d7a14a62f44666b3ef48dff863be01f676082387acd48035/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f6a756e69796173796f732f646173682d737461636b2d7468656d652d6a756e69796173796f73)](https://camo.githubusercontent.com/c0289749f5767de1d7a14a62f44666b3ef48dff863be01f676082387acd48035/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f6a756e69796173796f732f646173682d737461636b2d7468656d652d6a756e69796173796f73)[![PhpStan Level](https://camo.githubusercontent.com/aea6993733cd63f8c0509bd208548ef02a3a2459c5e5c25230c62866ad483b7f/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f5048505374616e2d6c6576656c253230372d627269676874677265656e2e737667)](https://camo.githubusercontent.com/aea6993733cd63f8c0509bd208548ef02a3a2459c5e5c25230c62866ad483b7f/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f5048505374616e2d6c6576656c253230372d627269676874677265656e2e737667)[![PHPStan](https://github.com/Fa-BRAIK/dash-stack-theme/actions/workflows/phpstan.yml/badge.svg)](https://github.com/Fa-BRAIK/dash-stack-theme/actions/workflows/phpstan.yml)[![Laravel Pint](https://github.com/Fa-BRAIK/dash-stack-theme/actions/workflows/pint.yml/badge.svg)](https://github.com/Fa-BRAIK/dash-stack-theme/actions/workflows/pint.yml)[![PHPUnit](https://github.com/Fa-BRAIK/dash-stack-theme/actions/workflows/pr-tests.yml/badge.svg)](https://github.com/Fa-BRAIK/dash-stack-theme/actions/workflows/pr-tests.yml) [![Dash Stack Theme Light/Dark](https://github.com/Fa-BRAIK/dash-stack-theme/raw/main/assets/dash_stack_theme.png?raw=true)](https://github.com/Fa-BRAIK/dash-stack-theme/blob/main/assets/dash_stack_theme.png?raw=true) > Tested on [Filamentphp demo app](https://github.com/filamentphp/demo) Acknowledgements ---------------- [](#acknowledgements) > Name based and Design inspired from [DashStack Theme](https://www.figma.com/community/file/1324762163080748317/dashstack-free-admin-dashboard-ui-kit-admin-dashboard-ui-kit-admin-dashboard). Big thanks for [Seju](https://www.figma.com/@sejal_ui_ux) for this amazing design. --- 🚀 Installation & Usage (Auto Mode) -------------------------------------- [](#-installation--usage-auto-mode) ### **Step 1: Install the Package** [](#step-1-install-the-package) Install the package using Composer: ``` composer require juniyasyos/dash-stack-theme-juniyasyos ``` ### **Step 2: Run Install Command** [](#step-2-run-install-command) This command will install required npm packages (if not already installed) and publish its assets. ``` php artisan filament-dash-stack-theme-juniyasyos:install ``` ### **Step 3: Register Filament Plugin** [](#step-3-register-filament-plugin) Within your targeted panel provider, register DashStack Theme Plugin: ``` use Juniyasyos\DashStackTheme\DashStackThemePlugin; // ... $panel->plugin(DashStackThemePlugin::make()); ``` --- 🔧 Development Mode ------------------ [](#-development-mode) ### **Step 1: Publish Assets Manually** [](#step-1-publish-assets-manually) Run the following commands to publish the assets: ``` php artisan vendor:publish --tag=dash-stack-theme-juniyasyos-assets --force php artisan vendor:publish --tag=dash-stack-theme-juniyasyos-dist --force ``` ### **Step 2: Configure Vite Theme in Filament Panel** [](#step-2-configure-vite-theme-in-filament-panel) Modify your **Filament Panel** configuration and set the `viteTheme` path to: ``` ->viteTheme('resources/css/filament/dash-stack-theme-juniyasyos/theme.css') ``` ### **Step 3: Build the Assets** [](#step-3-build-the-assets) After making any modifications, run the following command to compile the assets: ``` npm run build ``` ### **Development Notes** [](#development-notes) - Ensure that `vite.config.js` includes the correct input path for the theme CSS. - After publishing assets, you may need to clear the cache using `php artisan config:clear`. - If the styles are not reflecting, check if `npm run dev` or `npm run build` has been executed properly. --- ⚙️ Configuration ---------------- [](#️-configuration) DashStack theme comes by default with a configuration for primary color and predefined dashboard settings. To customize, publish the config file: ``` php artisan vendor:publish --tag=filament-dash-stack-theme-juniyasyos-config ``` Example configuration (`config/filament-dash-stack-theme-juniyasyos.php`): ``` use Juniyasyos\DashStackTheme\Support\Colors\Color; return [ 'default-colors' => [ 'primary' => Color::Blue, ], 'side-bar-collapsable-on-desktop' => true, 'collapsible-navigation-groups' => false, 'breadcrumbs' => false, /** * Nunito Sans is the default font for the theme. */ 'use-default-font' => true, ]; ``` > **Note:** The default font used for Dash Stack Theme is Nunito Sans. You can disable this by setting `use-default-font` to `false` in the config file. --- 📌 Upcoming Features ------------------- [](#-upcoming-features) If you have feature requests or suggestions, feel free to submit them on [GitHub](https://github.com/Fa-BRAIK/dash-stack-theme/issues). #### Planned Updates: [](#planned-updates) - Date / DateTime / DateRange component - Enhanced Select component (UI improvements) --- 🎨 Appearance ------------ [](#-appearance) - [Login Page](#login-page) - [Dashboard](#dashboard-page) - [Global Search](#global-search) - [Notifications](#notification-modal) - [User Menu](#user-menu) - [Resource Page](#resource-page) - [Grid Table](#grid-table) - [Forms](#forms) #### Login Page [](#login-page) Login Page Light Login Page Dark [![Login Page Light](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/login_page_light.png)](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/login_page_light.png) [![Login Page Dark](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/login_page_dark.png)](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/login_page_dark.png) #### Dashboard Page [](#dashboard-page) Dashboard Page Light Dashboard Page Dark [![Dashboard Page Light](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/dashboard_page_light.png)](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/dashboard_page_light.png) [![Dashboard Page Dark](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/dashboard_page_dark.png)](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/dashboard_page_dark.png) #### Global Search [](#global-search) Global Search Light Global Search Dark [![Global Search Light](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/global_search_light.png)](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/global_search_light.png) [![Global Search Dark](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/global_search_dark.png)](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/global_search_dark.png) #### Notification Modal [](#notification-modal) Notification Modal Light Notification Modal Dark [![Notification Modal Light](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/notification_modal_light.png)](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/notification_modal_light.png) [![Notification Modal Dark](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/notification_modal_dark.png)](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/notification_modal_dark.png) #### User Menu [](#user-menu) User Menu Light User Menu Dark [![User Menu Light](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/user_menu_light.png)](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/user_menu_light.png) [![User Menu Dark](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/user_menu_dark.png)](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/user_menu_dark.png) #### Resource Page [](#resource-page) Resource Page Light Resource Page Dark [![Resource Page Light](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/resources_page_light.png)](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/resources_page_light.png) [![Resource Page Dark](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/resources_page_dark.png)](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/resources_page_dark.png) #### Grid Table [](#grid-table) Grid Table Light Grid Table Dark [![Grid Table Light](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/grid_table_light.png)](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/grid_table_light.png) [![Grid Table Dark](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/grid_table_dark.png)](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/grid_table_dark.png) #### Forms [](#forms) Forms Light Forms Dark [![Forms Light](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/form_light.png)](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/form_light.png) [![Forms Dark](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/form_dark.png)](https://raw.githubusercontent.com/Fa-BRAIK/dash-stack-theme/main/assets/screenshots/form_dark.png) ### Health Score 38 — LowBetter than 85% of packages Maintenance56 Moderate activity, may be stable Popularity17 Limited adoption so far Community11 Small or concentrated contributor base Maturity56 Maturing project, gaining track record Bus Factor1 Top contributor holds 84.5% 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 ~20 days Recently: every ~34 days Total 8 Last Release 291d ago ### Community Maintainers ![](https://www.gravatar.com/avatar/13dafb0bb45c4dbf74b7d4a75e9e1d2c335fcaa1fb4e32f135ac4fb4fee5f1aa?d=identicon)[Ahmad Ilyas](/maintainers/Ahmad%20Ilyas) --- Top Contributors [![Fa-BRAIK](https://avatars.githubusercontent.com/u/36890379?v=4)](https://github.com/Fa-BRAIK "Fa-BRAIK (60 commits)")[![juniyasyos](https://avatars.githubusercontent.com/u/111669845?v=4)](https://github.com/juniyasyos "juniyasyos (10 commits)")[![alkoumi](https://avatars.githubusercontent.com/u/10585943?v=4)](https://github.com/alkoumi "alkoumi (1 commits)") --- Tags phpfilamentfilamentphpfilamentphp-themedashStackdashboard-theme ### Code Quality TestsPHPUnit Static AnalysisPHPStan Code StyleLaravel Pint ### Embed Badge ![Health badge](/badges/juniyasyos-dash-stack-theme-juniyasyos/health.svg) ``` [![Health](https://phpackages.com/badges/juniyasyos-dash-stack-theme-juniyasyos/health.svg)](https://phpackages.com/packages/juniyasyos-dash-stack-theme-juniyasyos) ``` ### Alternatives [nuxtifyts/dash-stack-theme DashStack theme for filament php 1914.0k](/packages/nuxtifyts-dash-stack-theme)[andreia/filament-nord-theme A minimalist Arctic Nord theme for FilamentPHP 13334.7k2](/packages/andreia-filament-nord-theme)[dotswan/filament-map-picker Easily pick and retrieve geo-coordinates using a map-based interface in your Filament applications. 124139.3k2](/packages/dotswan-filament-map-picker)[guava/filament-modal-relation-managers Allows you to embed relation managers inside filament modals. 7565.0k4](/packages/guava-filament-modal-relation-managers)[tapp/filament-google-autocomplete-field Filament plugin that provides a Google Autocomplete field 3098.1k](/packages/tapp-filament-google-autocomplete-field)[stephenjude/filament-jetstream A Laravel starter kit built with Filament inspired by Jetstream. 17554.3k2](/packages/stephenjude-filament-jetstream) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)