Gentelella Admin Template Documentation

Modern Bootstrap 5 Admin Dashboard Template with Vite Build System & Performance Optimizations

Get Started Now View on GitHub

Welcome to Gentelella v2.0

Gentelella is a modern, powerful, and completely free Bootstrap 5 admin template that has been completely rebuilt with Vite, performance optimizations, and the latest web technologies.

✨ What’s New in Version 2.0

  • 🚀 90% smaller initial bundle (779KB → 79KB)
  • ⚡ 40-70% faster page loads with intelligent code splitting
  • 📦 Modern Build System with Vite 7.3
  • 🎨 Bootstrap 5.3.8 with updated design system
  • 🧩 Smart Module Loading - Load only what you need
  • 📱 Mobile-First responsive design

📊 Performance Metrics

Metric Before After Improvement
Initial Bundle Size 779 KB 79 KB 90% smaller
Total Page Load 1.3 MB 770 KB 40% reduction
First Contentful Paint 2.1s 0.8s 62% faster
Time to Interactive 3.5s 1.2s 66% faster

Quick Start

Prerequisites

  • Node.js (v18 or higher)
  • npm, yarn, or pnpm package manager

Installation 

# Clone the repository
git clone https://github.com/puikinsh/gentelella.git
cd gentelella

# Install dependencies
npm install

# Start development server
npm run dev
# Your server will be running at http://localhost:3000

Alternative Installation 

# npm package
npm install gentelella --save

# yarn package  
yarn add gentelella

Features Overview

🏠 Dashboard Components

  • 3 Dashboard Layouts - Different styles for various use cases
  • Widget Cards - Revenue, stats, progress indicators
  • Real-time Charts - Live data visualization
  • Activity Feeds - User activity and notifications

📊 Data Visualization

  • Chart.js - Modern, responsive charts
  • ECharts - Advanced interactive visualizations
  • Leaflet Maps - Interactive maps with markers and layers

📝 Form Components

  • Multi-step Wizards - Complex form workflows
  • Rich Text Editors - WYSIWYG content editing
  • File Upload - Drag & drop with progress tracking
  • Advanced Selects - Searchable, multi-select dropdowns

📋 Table Components

  • DataTables - Advanced sorting, filtering, pagination
  • Responsive Tables - Mobile-optimized displays
  • Export Functions - PDF, Excel, CSV export options

Technology Stack

Core Technologies

  • Bootstrap 5.3 - CSS Framework
  • Vite - Build Tool with code splitting
  • SASS - CSS Preprocessor
  • Vanilla JavaScript - jQuery-free DOM manipulation

Chart Libraries

  • Chart.js - Modern responsive charts
  • ECharts - Advanced data visualization
  • Leaflet - Interactive maps

Form & UI Libraries

  • Choices.js - Enhanced dropdown selections
  • Tempus Dominus - Bootstrap 5 date/time picker
  • nouislider - Range slider controls
  • DataTables - Advanced table functionality
  • FullCalendar - Interactive calendar

Browser Support

Browser Version
Chrome 88+
Firefox 85+
Safari 14+
Edge 88+
Opera 74+

Internet Explorer is not supported - We focus on modern browsers for the best performance and features.

License

MIT License - Free for personal and commercial use with attribution to Colorlib.

Next Steps

Made with ❤️ by Colorlib