PHPackages                             nasirkhan/laravel-cube - 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. nasirkhan/laravel-cube

ActiveLibrary[Utility & Helpers](/categories/utility)

nasirkhan/laravel-cube
======================

A unified component library for Laravel applications supporting both Tailwind CSS (with Flowbite) and Bootstrap frameworks

v2.2.0(1mo ago)22491GPL-3.0-or-laterBladePHP ^8.3

Since Feb 10Pushed 1mo agoCompare

[ Source](https://github.com/nasirkhan/laravel-cube)[ Packagist](https://packagist.org/packages/nasirkhan/laravel-cube)[ Docs](https://github.com/nasirkhan/laravel-cube)[ RSS](/packages/nasirkhan-laravel-cube/feed)WikiDiscussions main Synced 1mo ago

READMEChangelog (10)Dependencies (10)Versions (11)Used By (1)

Laravel Cube
============

[](#laravel-cube)

[![Laravel Cube - A versatile collection of reusable UI components for Laravel applications, supporting Tailwind CSS and Bootstrap 5](https://camo.githubusercontent.com/e262e57cb448a6485bda86614e20c3aefcb7a536759937edc4e6cdd5ecd7a535/68747470733a2f2f7265732e636c6f7564696e6172792e636f6d2f64736c6731666338792f696d6167652f75706c6f61642f76313737343638343931362f6c61726176656c5f637562655f7061636b6167655f6c6f676f5f7a38787161612e6a7067)](https://camo.githubusercontent.com/e262e57cb448a6485bda86614e20c3aefcb7a536759937edc4e6cdd5ecd7a535/68747470733a2f2f7265732e636c6f7564696e6172792e636f6d2f64736c6731666338792f696d6167652f75706c6f61642f76313737343638343931362f6c61726176656c5f637562655f7061636b6167655f6c6f676f5f7a38787161612e6a7067)

A versatile collection of reusable UI components for Laravel applications with **dual framework support** - use Tailwind CSS or Bootstrap 5 seamlessly.

This package is used in [Laravel Starter](https://github.com/nasirkhan/laravel-starter) though it is framework-agnostic and can be dropped into any Laravel app.

[![Latest Version on Packagist](https://camo.githubusercontent.com/45f5f9f72e287775b66911e8912aa600d2a23cbffe07326c19cc19783398d792/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f6e617369726b68616e2f6c61726176656c2d637562652e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/nasirkhan/laravel-cube)[![Total Downloads](https://camo.githubusercontent.com/cbcf0f6326f728bb79ef81be48d1c8d91c6116cea0e347c771908c1caa9b52a1/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f6e617369726b68616e2f6c61726176656c2d637562652e7376673f7374796c653d666c61742d737175617265)](https://packagist.org/packages/nasirkhan/laravel-cube)[![StyleCI](https://camo.githubusercontent.com/9058ed9a3d373800c2001867e51049e8d3463c5881d6274335d01a1ca9a7e1c1/68747470733a2f2f6769746875622e7374796c6563692e696f2f7265706f732f313135343737363035322f736869656c643f6272616e63683d6d61696e267374796c653d666c61742d737175617265)](https://github.styleci.io/repos/1154776052)

Features
--------

[](#features)

- **🎨 Dual Framework Support** - Use Tailwind CSS (Flowbite) or Bootstrap 5
- **🔄 Framework Switching** - Change frameworks per component or globally
- **18+ Reusable Components** - UI, forms, navigation, and utility components
- **🌙 Dark Mode** - Built-in dark mode support (Tailwind)
- **⚡ Alpine.js Integration** - Enhanced interactivity (Tailwind components)
- **📱 Livewire Compatible** - Works seamlessly with Livewire 3/4
- **♿ Accessible** - ARIA attributes, keyboard navigation, focus management
- **🎛️ Customizable** - Override styles, extend functionality, publish views
- **✅ Type Safe** - Proper validation of component properties
- **📚 Well Documented** - Comprehensive documentation with examples

Why "Cube"?
-----------

[](#why-cube)

The cube represents versatility and multidimensionality - just like this package that adapts to your framework choice (Tailwind or Bootstrap) while maintaining a unified component API.

Components Included
-------------------

[](#components-included)

### UI Components (7)

[](#ui-components-7)

- **Button** - `` - Versatile button with variants, sizes, loading states
- **Modal** - `` - Modal dialog with focus management
- **Card** - `` - Card component with image, title, and content
- **Badge** - `` - Badge for labels and tags
- **Icon** - `` - Dynamic Flowbite icon component (`name` + merged classes)
- **Footer Credit** - `` - Display copyright text
- **Footer License** - `` - Display licensing information (supports Creative Commons)

### Utility Components (1)

[](#utility-components-1)

- **Google Analytics** - `` - Google Analytics tracking integration

### Form Components (8)

[](#form-components-8)

- `` - Text input with validation support
- `` - Label with required indicator
- `` - Error display component
- `` - Complete form field wrapper
- `` - Styled checkbox
- `` - Select dropdown
- `` - Textarea field
- `` - iOS/Bootstrap toggle switch

### Navigation Components (2)

[](#navigation-components-2)

- `` - Navigation link with active state
- `` - Mobile navigation link

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

[](#requirements)

- PHP ^8.3
- Laravel ^11.0 || ^12.0 || ^13.0
- Livewire ^3.0 || ^4.0
- Tailwind CSS **OR** Bootstrap 5
- Alpine.js (included with Livewire, for Tailwind components)

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

[](#installation)

Install the package via composer:

```
composer require nasirkhan/laravel-cube
```

Flowbite Blade Icons is installed automatically as a dependency of Laravel Cube.

The package will automatically register its service provider.

### Configuration

[](#configuration)

Set your default framework in `.env`:

```
CUBE_FRAMEWORK=tailwind  # or 'bootstrap'
```

### Tailwind CSS Setup

[](#tailwind-css-setup)

If you are using **Tailwind CSS v4**, you must import the package's CSS file so Tailwind can detect the utility classes used inside Cube components. Without this step, classes like `bg-gray-800` (used by the primary button) will be purged from your compiled CSS, causing components to render incorrectly (e.g. invisible button text in light mode).

Add a single `@import` to your application's CSS file (e.g. `resources/css/app.css`):

```
@import "../../vendor/nasirkhan/laravel-cube/resources/css/tailwind.css";
```

> **Why is this needed?** Tailwind v4 auto-detects classes from your source files, but it excludes `vendor/` (which is typically in `.gitignore`). The imported file declares `@source` directives pointing at the Cube package's views and config, so all Cube utility classes are always included in your build.

This step is **not required** when using Bootstrap.

### Publish Assets (Optional)

[](#publish-assets-optional)

Publish the configuration file:

```
php artisan vendor:publish --tag=cube-config
```

Publish the views (for customization):

```
php artisan vendor:publish --tag=cube-views
```

Usage
-----

[](#usage)

### Framework Selection

[](#framework-selection)

**Global (via config):**

```
# .env
CUBE_FRAMEWORK=tailwind
```

**Per Component:**

```

    Bootstrap Button

    Tailwind Button

```

### Basic Examples

[](#basic-examples)

#### Buttons

[](#buttons)

**Tailwind (Default):**

```
Save
Delete
Cancel
Processing...
```

#### Icons (Flowbite)

[](#icons-flowbite)

```

```

See full icon docs (params and preview table): `docs/icons.md`

**Bootstrap:**

```
Save
Delete
Submit
```

#### Form Components

[](#form-components)

**Tailwind Form:**

```

```

**Bootstrap Form:**

```

```

#### Checkbox & Toggle

[](#checkbox--toggle)

**Tailwind:**

```
Remember me
Enable notifications
```

**Bootstrap:**

```
Remember me
Enable notifications
```

#### Navigation

[](#navigation)

**Tailwind:**

```

    Dashboard

```

**Bootstrap:**

```

    Dashboard

```

#### Modal

[](#modal)

**Tailwind (Alpine.js):**

```

        Delete Account
        Are you sure?

                Cancel

            Delete

{{-- Trigger modal --}}

    Open Modal

```

**Bootstrap:**

```

        Delete Account

        Are you sure you want to delete your account?

        Cancel
        Delete

{{-- Trigger modal --}}

    Open Modal

```

#### Footer Components

[](#footer-components)

**Footer Credit (Tailwind):**

```

```

**Footer Credit (Bootstrap):**

```

```

**Footer License - Default (Tailwind):**

```

```

**Footer License - Creative Commons (Tailwind):**

```

```

**Footer License (Bootstrap):**

```

```

#### Google Analytics

[](#google-analytics)

Add Google Analytics tracking to your application. The component automatically retrieves the tracking ID from your settings if available.

**Basic Usage:**

```
{{-- Uses setting('google_analytics') by default --}}

```

**With Custom Tracking ID:**

```

```

Add this component in your layout's `` section or before the closing `` tag.

Component Variants
------------------

[](#component-variants)

### Button Variants

[](#button-variants)

**Available for both frameworks:**

- `primary` - Primary action
- `secondary` - Secondary action
- `danger` - Destructive action
- `success` - Success action
- `warning` - Warning action
- `info` - Informational action
- `light` - Light variant
- `dark` - Dark variant
- `link` - Link style

### Button Sizes

[](#button-sizes)

- `sm` - Small
- `md` - Medium (default)
- `lg` - Large

Customization
-------------

[](#customization)

### Override Styles

[](#override-styles)

Publish the configuration and modify CSS classes:

```
php artisan vendor:publish --tag=cube-config
```

Edit `config/cube.php`:

```
'tailwind' => [
    'buttons' => [
        'primary' => 'bg-purple-600 hover:bg-purple-700...',
    ],
],
```

### Extend Components

[](#extend-components)

Publish views and customize:

```
php artisan vendor:publish --tag=cube-views
```

Views will be in `resources/views/vendor/cube/components/`

Testing
-------

[](#testing)

```
composer test
```

Changelog
---------

[](#changelog)

Please see [CHANGELOG](CHANGELOG.md) for more information on what has changed recently.

Contributing
------------

[](#contributing)

Please see [CONTRIBUTING](CONTRIBUTING.md) for details.

Security
--------

[](#security)

If you discover any security related issues, please email  instead of using the issue tracker.

Credits
-------

[](#credits)

- [Nasir Khan](https://github.com/nasirkhan)
- [All Contributors](../../contributors)

License
-------

[](#license)

The GNU General Public License v3.0 or later. Please see [License File](LICENSE) for more information.

###  Health Score

47

—

FairBetter than 94% of packages

Maintenance90

Actively maintained with recent releases

Popularity20

Limited adoption so far

Community12

Small or concentrated contributor base

Maturity55

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 98.1% 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 ~5 days

Total

9

Last Release

53d ago

Major Versions

v1.5.0 → v2.0.02026-03-22

PHP version history (2 changes)v1.0.0PHP ^8.2

v2.0.0PHP ^8.3

### Community

Maintainers

![](https://www.gravatar.com/avatar/27802773a2668018fdca8b76c35d03ce16cfc92c0f9c6703fb532e77780eadc0?d=identicon)[nasirkhan](/maintainers/nasirkhan)

---

Top Contributors

[![nasirkhan](https://avatars.githubusercontent.com/u/396987?v=4)](https://github.com/nasirkhan "nasirkhan (53 commits)")[![StyleCIBot](https://avatars.githubusercontent.com/u/11048387?v=4)](https://github.com/StyleCIBot "StyleCIBot (1 commits)")

---

Tags

blade-componentsbootstrap-colaravel-component-librarylaravel-componentstailwind-comlaravelcomponentstailwindbootstrapFormsnavigationalpineflowbiteblade-componentsui-componentscube

###  Code Quality

TestsPHPUnit

### Embed Badge

![Health badge](/badges/nasirkhan-laravel-cube/health.svg)

```
[![Health](https://phpackages.com/badges/nasirkhan-laravel-cube/health.svg)](https://phpackages.com/packages/nasirkhan-laravel-cube)
```

###  Alternatives

[livewire/flux

The official UI component library for Livewire.

9385.0M86](/packages/livewire-flux)[nwidart/laravel-menus

Laravel Menu management

168180.3k10](/packages/nwidart-laravel-menus)[akaunting/laravel-menu

Menu and sidebar management package for Laravel

38233.8k](/packages/akaunting-laravel-menu)[rinvex/laravel-menus

Rinvex Menus is a simple menu builder package for Laravel, that supports hierarchical structure, ordering, and styling with full flexibility using presenters for easy styling and custom structure of menu rendering.

294.0k20](/packages/rinvex-laravel-menus)

PHPackages © 2026

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