G Gentelella v4.1.1

Laravel

Gentelella v4 as a Laravel package. Blade layouts, a config-driven sidebar, 25 components and a CRUD engine with server-side tables — vanilla JS and SCSS, no Bootstrap, no jQuery.

Last updated September 9, 2026

The Laravel edition is a Composer package — ColorlibHQ/gentelella-laravel. Live demo →

Requirements

PHP 8.3+
Laravel 13
Node.js 18+ (Vite asset pipeline)

1. Require the package

composer require colorlibhq/gentelella-laravel

2. Run the installer

php artisan gentelella:install

It publishes config/gentelella.php and writes two Vite entry stubs:

resources/js/gentelella.js     imports the design system, then your overrides
resources/css/gentelella.scss  your overrides

3. Install the frontend dependencies

npm install gentelella@^4.1 sass

Only two. ECharts, DataTables and Leaflet are pulled in lazily by the pages that use them, exactly as in the HTML edition — nothing ships to a page that does not need it.

4. Wire Vite

// vite.config.js
import { defineConfig } from 'vite'
import laravel from 'laravel-vite-plugin'

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

One entry, not two. gentelella.js imports the design system and then gentelella.scss, so your overrides always load after the base. Listing the stylesheet as a second Vite entry leaves the order undefined, because Vite also emits CSS from the JS graph.

5. Build

npm run dev      # development
npm run build    # production

6. Your first page

{{-- resources/views/dashboard.blade.php --}}
@extends('gentelella::page')

@section('title', 'Dashboard')
@section('page_key', 'dashboard')
@section('breadcrumb', 'Home > Dashboard')

@section('content')
    <x-gentelella::page-header title="Dashboard" pretitle="Overview" />

    <x-gentelella::card title="Revenue">

    </x-gentelella::card>
@endsection
Route::get('/dashboard', fn () => view('dashboard'))->name('dashboard');

That is a complete page: sidebar, topbar, breadcrumb, dark mode and the ⌘K palette all come from the layout.

Optional next steps

php artisan gentelella:make-auth   # own the auth screens
php artisan gentelella:crud Product   # scaffold a CRUD panel from a table
php artisan gentelella:demo        # seed the bundled showcase (demo mode only)