PHPackages                             servecore/shadcn-blade - 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. servecore/shadcn-blade

ActiveLibrary[Templating & Views](/categories/templating)

servecore/shadcn-blade
======================

ServeCore Preset for Laravel Shadcn Blade Components

v1.1.17(3mo ago)014MITBladeCI failing

Since Jan 21Pushed 3mo agoCompare

[ Source](https://github.com/servecore/servecore-shadcn-blade)[ Packagist](https://packagist.org/packages/servecore/shadcn-blade)[ RSS](/packages/servecore-shadcn-blade/feed)WikiDiscussions main Synced 1mo ago

READMEChangelog (1)DependenciesVersions (22)Used By (0)

ServeCore Shadcn Blade
======================

[](#servecore-shadcn-blade)

A Laravel preset that installs beautiful, accessible Shadcn UI components built with Blade and Alpine.js.

Features
--------

[](#features)

- 🎨 **33+ Pre-built Components**: Accordion, Alert, Avatar, Badge, Breadcrumb, Button, Card, Carousel, Checkbox, Collapsible, Dialog, Dropdown, Input, Label, Navbar, Pagination, Progress, Radio Group, Scroll Area, Select, Separator, Sheet, Sidebar, Skeleton, Switch, Table, Tabs, Textarea, Theme Toggle, Toast, Toggle, Tooltip, and more.
- 🌙 **Dark Mode**: Flicker-free theme system (Light/Dark/System)
- 🎯 **Zero Config**: One command installation
- ⚡ **Alpine.js**: Lightweight reactivity
- 🎭 **Tailwind CSS v4**: Modern styling engine
- 🛠️ **Full Stubs**: Includes the complete `shadcn-stubs` directory for custom component generation.

Installation
------------

[](#installation)

1. **Require the package**:

    ```
    composer require servecore/shadcn-blade
    ```
2. **Run the installer**:

    ```
    php artisan servecore:install
    ```
3. **Compile assets**:

    ```
    npm install && npm run dev
    ```

What Gets Installed
-------------------

[](#what-gets-installed)

The preset copies the following to your Laravel project:

- **Components**: `resources/views/components/` (Full suite of ShadCN components)
- **Demo Page**: `resources/views/servecore-test.blade.php` (Usage examples)
- **Stubs**: `resources/shadcn-stubs/` (Blueprints for generating components)
- **JavaScript**: `resources/js/theme.js` and `resources/js/init-theme.js`
- **Styles**: `resources/css/app.css` (ShadCN variables + Tailwind config)
- **Dependencies**: `embla-carousel` and `embla-carousel-autoplay`

Usage
-----

[](#usage)

### Theme System

[](#theme-system)

Add to your layout's ``:

```

@vite(['resources/css/app.css', 'resources/js/app.js'])
```

Add the toggle button anywhere:

```

```

### Components

[](#components)

```
{{-- Button with loading --}}
Save

{{-- Dialog --}}

    Open

        Title
        Content here

{{-- Select --}}

        United States

```

Manual Setup (Optional)
-----------------------

[](#manual-setup-optional)

If you want to understand what the installer does, here's the manual setup:

### 1. CSS Setup

[](#1-css-setup)

The installer copies `app.css` with Tailwind v4 configuration and ShadCN color variables:

```
@import "tailwindcss";

@theme {
  --color-background: 0 0% 100%;
  --color-foreground: 222.2 84% 4.9%;
  /* ... more variables */
}

.dark {
  --color-background: 222.2 84% 4.9%;
  --color-foreground: 210 40% 98%;
  /* ... dark mode variables */
}

[x-cloak] {
  display: none !important;
}
```

### 2. JavaScript Setup

[](#2-javascript-setup)

The installer updates `resources/js/app.js` to include:

```
import Alpine from 'alpinejs';
import theme, { initializeTheme } from './theme';

// Initialize theme before Alpine
initializeTheme();

// Register theme component
Alpine.data('theme', theme);

window.Alpine = Alpine;
Alpine.start();
```

### 3. Vite Configuration

[](#3-vite-configuration)

Ensure your `vite.config.js` includes:

```
import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
    plugins: [
        laravel({
            input: ['resources/css/app.css', 'resources/js/app.js'],
            refresh: true,
        }),
    ],
});
```

Requirements
------------

[](#requirements)

- Laravel 11+
- PHP 8.2+
- Node.js & NPM

License
-------

[](#license)

MIT

Credits
-------

[](#credits)

Built with love by ServeCore Team.

###  Health Score

37

—

LowBetter than 82% of packages

Maintenance85

Actively maintained with recent releases

Popularity6

Limited adoption so far

Community8

Small or concentrated contributor base

Maturity43

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 96.6% 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 ~0 days

Total

21

Last Release

106d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/b180dbb46e2efae3fa2fe6a7f599ddc64286ae4afa3695132af95f4d13f6e286?d=identicon)[servecore](/maintainers/servecore)

---

Top Contributors

[![servecore](https://avatars.githubusercontent.com/u/254398698?v=4)](https://github.com/servecore "servecore (28 commits)")[![idpcks](https://avatars.githubusercontent.com/u/136402646?v=4)](https://github.com/idpcks "idpcks (1 commits)")

### Embed Badge

![Health badge](/badges/servecore-shadcn-blade/health.svg)

```
[![Health](https://phpackages.com/badges/servecore-shadcn-blade/health.svg)](https://phpackages.com/packages/servecore-shadcn-blade)
```

###  Alternatives

[mustache/mustache

A Mustache implementation in PHP.

3.3k44.6M291](/packages/mustache-mustache)[roots/acorn

Framework for Roots WordPress projects built with Laravel components.

9682.1M97](/packages/roots-acorn)[whitecube/nova-flexible-content

Flexible Content & Repeater Fields for Laravel Nova.

8053.0M25](/packages/whitecube-nova-flexible-content)[mopa/bootstrap-bundle

Easy integration of twitters bootstrap into symfony2

7042.9M33](/packages/mopa-bootstrap-bundle)[limenius/react-bundle

Client and Server-side react rendering in a Symfony Bundle

3871.2M](/packages/limenius-react-bundle)[nicmart/string-template

StringTemplate is a very simple string template engine for php. I've written it to have a thing like sprintf, but with named and nested substutions.

2101.7M30](/packages/nicmart-string-template)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)