AdminLTE is a fully responsive administration template. Based on Bootstrap 5 framework and also the JavaScript plugins. Highly customizable and easy to use. Fits many screen resolutions from small mobile devices to large desktops.
The first stable release of the v4 line — a ground-up rewrite on Bootstrap 5.3 with no jQuery. Highlights:
18 new demo pages
- Apps: Calendar (FullCalendar), Kanban (SortableJS), Chat, File Manager, Projects, Mailbox (Inbox / Read / Compose)
- Forms: Wizard (4-step with validation)
- Tables: Data Tables (Tabulator — jQuery-free)
- Pages: Profile, Settings, Invoice, Pricing, FAQ
- Errors: 404, 500, Maintenance
Documentation overhaul
- New pages: Getting Started, Customization & Theming, RTL Support, Migration from v3, Layout Blueprint, Recipes, Deployment & Performance, Recommended Integrations, JavaScript Plugins Overview
- Rewritten Introduction with four labelled install paths (CDN / npm / source / Composer)
- FAQ rebuilt as a custom page with hero, live search, section chips, and an accordion of 19 questions across six topics
- Split sidebar navigation: dashboard demo and docs each have their own nav, no more docs entries cluttering the live preview
- Reading-friendly typography across all docs pages, with constrained line length, prose-tuned heading rhythm, styled reference tables, info callouts, and pill inline code
Six issue fixes
bi-circle-halffor the Auto color-mode icon (#6028)table-head-fixedrespects dark mode (#6026)- Fullscreen icon toggles
.d-noneinstead of inlinedisplayso it works with any icon library (#6021) - Sidebar (including brand) stays pinned when using
fixed-header(#6020) - Pie chart on
index2.htmlno longer flickers on browser zoom (#6019) - Color-mode toggle now visible by default in the topbar with localStorage persistence (#6010)
Major dependency upgrades
- ESLint 9 → 10, TypeScript 5.9 → 6, Stylelint 16 → 17
- Astro 6.0 → 6.3, autoprefixer / postcss / rollup / sass / terser refreshed
- Bootstrap 5.3.8, Node 22 LTS in CI
- Dropped dead
eslint-plugin-import,eslint-config-xo*, and the legacy.eslintrc.json - npm
overridesforyaml+stylelint-config-twbs-bootstrapsonpm installruns without--legacy-peer-depsand reports 0 vulnerabilities
Breaking changes from v3
- Class renames:
.wrapper→.app-wrapper,.main-header→.app-header,.main-sidebar→.app-sidebar,.content-wrapper→.app-main - Data attributes:
data-toggle→data-bs-toggle,data-widget="pushmenu"→data-lte-toggle="sidebar",data-widget="treeview"→data-lte-toggle="treeview" - Dark mode:
.dark-modebody class →data-bs-theme="dark"attribute (Bootstrap 5.3 native) - jQuery no longer required; plugins are vanilla TypeScript
See the dedicated Migration from v3 guide and the CHANGELOG.md for the full list.
Install:
npm install admin-lte@4.0.0AdminLTE.io just opened a new premium templates page. Hand picked to ensure the best quality and the most affordable prices. Visit https://adminlte.io/premium for more information.
AdminLTE has been carefully coded with clear comments in all of its JS, SCSS and HTML files. SCSS has been used to increase code customizability.
To start developing with AdminLTE:
- Install dependencies:
npm install - Start development server:
npm start(opens browser at http://localhost:3000) - Start coding! Files auto-compile and refresh on changes
To build for production:
- Full production build:
npm run production(includes linting and optimization) - Quick build:
npm run build(faster for development/testing)
npm start- Start development server with file watchingnpm run build- Build all assets for developmentnpm run production- Full production build with linting and bundlewatchnpm run lint- Run all linters (JS, CSS, docs, lockfile)npm run css- Build CSS onlynpm run js- Build JavaScript only
AdminLTE supports all modern browsers with the latest Bootstrap 5.3.8:
- Chrome (latest)
- Firefox (latest)
- Safari (latest)
- Edge (latest)
AdminLTE v4 build scripts work cross-platform:
- Windows - Command Prompt, PowerShell, Git Bash
- macOS - Terminal, iTerm2
- Linux - Bash, Zsh, and other Unix shells
All npm scripts use cross-platform utilities to ensure consistent behavior across different operating systems.
AdminLTE is a UI template - when deploying to production, follow these critical guidelines:
What to Deploy:
- Only compiled production assets:
dist/js/adminlte.min.jsanddist/css/adminlte.min.css - Your application-specific files
What NOT to Deploy:
node_modules/directory- Demo/example HTML files (index.html, index2.html, index3.html, etc.)
- Source files (
src/directory) - Development configuration files
CVE-2021-36471 Notice: This CVE is disputed and does not represent a vulnerability in AdminLTE. It refers to demo pages being accessible when developers incorrectly deploy example files to production. AdminLTE v4 has a clear separation between development demos and production assets. See SECURITY.md for complete details.
Production Build:
npm run production # Builds optimized assets in dist/For detailed security guidelines, authentication requirements, and best practices, see SECURITY.md.
Support AdminLTE development by becoming a sponsor or donor.
Your avatar here? Become a sponsor
- Highly welcome.
- For your extra reference check AdminLTE v4 Contribution Guide
- First thing first, you should have bit knowledge about NodeJS.
- Github Knowledge.
- Install NodeJS LTS version.
- Clone this Repository to your machine and change to
masterbranch. - Go to Cloned Folder.
- In cli/bash run
npm installit will install dependency frompackage.json. - After installation completes, run
npm start - Cool, Send your changes in PR to
masterbranch.
AdminLTE is an open source project by AdminLTE.io that is licensed under MIT. AdminLTE.io reserves the right to change the license of future releases.
