Introduction

AdminLTE 4 is the free, open-source, MIT-licensed admin dashboard template that every official framework port is built on — a fully responsive control panel built on Bootstrap 5.3 with vanilla JavaScript and no jQuery.

AdminLTE is the most popular open-source admin dashboard template on the web. Version 4 is a ground-up rewrite on Bootstrap 5.3: the entire JavaScript layer was rebuilt in TypeScript and ships as a tiny dependency-free bundle, jQuery is gone, and dark mode is native via Bootstrap's data-bs-theme attribute. It fits every screen from small phones to large desktops, supports RTL, and is WCAG 2.1 AA accessible out of the box.

This is the HTML / Bootstrap core — the canonical implementation. The React, Vue, Angular, Laravel, Symfony, Django, and ASP.NET Core editions all wrap this same design and CSS/JS for their stack.

Key features

  • Bootstrap 5.3 — built directly on the latest Bootstrap, inheriting its grid, components, utilities, and CSS-custom-property theming.
  • Vanilla JavaScript, no jQuery — small plugins (Layout, PushMenu, Treeview, CardWidget, DirectChat, FullScreen, ColorMode, Accessibility) written in TypeScript and wired entirely through data-lte-* attributes, with a Bootstrap-style lifecycle API (getInstance / getOrCreateInstance / dispose).
  • Native dark / light / auto mode — Bootstrap 5.3 data-bs-theme managed by the bundled ColorMode module, with a no-flash init script and OS-preference following.
  • Fully responsive layout — a CSS-grid app shell with a collapsible, off-canvas-on-mobile sidebar.
  • RTL support — a prebuilt adminlte.rtl.css for right-to-left languages.
  • Accessible — skip links, ARIA landmarks, focus management, and reduced-motion support meeting WCAG 2.1 AA.
  • MIT-licensed — free for personal and commercial use, forever.

What's new in v4

The v4 line is a complete rewrite. Highlights:

  • No jQuery — plugins are vanilla TypeScript; the published JS bundle gzips to roughly 5 KB.
  • 18 new demo pages — Calendar (FullCalendar), Kanban (SortableJS), Chat, File Manager, Projects, Mailbox (Inbox / Read / Compose), a 4-step form Wizard, jQuery-free data tables (Tabulator), Profile, Settings, Invoice, Pricing, FAQ, and 404 / 500 / Maintenance error pages.
  • Documentation overhaul — new Getting Started, Customization & Theming, RTL, Migration, Layout Blueprint, Recipes, Deployment, and Integrations guides.
  • Major dependency upgrades — ESLint 10, TypeScript 6, Stylelint 17, Astro 6, Bootstrap 5.3.8; npm install runs clean with 0 vulnerabilities.

New in 4.2.0

  • Server-rendered themes are respected — ColorMode now resolves light/dark in a defined order: the visitor's stored choice first, then a theme the page declared itself in <html data-bs-theme="light|dark">, then the OS preference. A theme rendered server-side from a cookie or a user record is no longer overwritten on load, and no longer lost the first time the OS preference changes. See Theming.
  • ColorMode opt-out for apps with their own theming — add data-lte-color-mode="off" to <html> and AdminLTE never writes data-bs-theme: not on load, not on a toggle click, not when the OS preference changes. This is also the escape hatch for custom Bootstrap theme names, which ColorMode cannot resolve.
  • initialize() / teardown() for client-side rendered layouts — frameworks that build the layout after DOMContentLoaded into a persistent <body> (GWT and similar widget toolkits) can call adminlte.initialize() once the layout is attached; teardown() is the inverse for apps that unmount it. See Components.
  • Three new demo pagesforms/advanced.html (Tom Select and Flatpickr: searchable and tag-style selects, remote data with pagination, date/date-time/range/time pickers), forms/editors.html (Quill 2 in snow and bubble themes), and layout/top-nav.html (a sidebar-less layout whose navigation lives in the app-header).
  • Optional Select2 compatibility themedist/css/adminlte-select2.css, a styling-only sheet for projects that cannot drop Select2 yet. No JavaScript, no jQuery, and nothing added to adminlte.css. See Charts & Plugins.
  • Fix: a sidebar rendered collapsed stays collapsed — a page shipping <body class="sidebar-collapse"> no longer springs open on wide screens during initialisation.

New in 4.1.0

  • ESM + TypeScript on npm — the package now ships an ESM bundle (dist/js/adminlte.esm.js) alongside the UMD build, with type declarations and a full exports map: import { PushMenu } from 'admin-lte' works with types in Vite/webpack. Bootstrap is a peer dependency that npm installs automatically.
  • Component lifecycle API — every component exposes getInstance, getOrCreateInstance, and dispose, and the data API is delegated at the document level, so dynamically inserted markup works without re-initialisation. Events were overhauled too: cancelable before-events and animation-complete after-events, all bubbling. See Components.
  • Bundled ColorMode module — light / dark / auto with localStorage persistence and automatic toggle binding is now part of the JS bundle; no copy-paste controller script needed. See Theming.
  • Smaller CSSadminlte.min.css is down to ~40 KB gzipped (from ~47 KB in 4.0.3); docs-site-only styles were split into a separate stylesheet that apps never load.

Breaking changes from v3: class renames (.wrapper.app-wrapper, .main-header.app-header, .main-sidebar.app-sidebar, .content-wrapper.app-main), data-attribute changes (data-toggledata-bs-toggle, data-widget="pushmenu"data-lte-toggle="sidebar"), and dark mode moving from a .dark-mode body class to the data-bs-theme="dark" attribute.

Install in one line

npm install admin-lte@4

Or skip the build entirely and load the prebuilt files straight from jsDelivr:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/admin-lte@4.2.0/dist/css/adminlte.min.css">
<script src="https://cdn.jsdelivr.net/npm/admin-lte@4.2.0/dist/js/adminlte.min.js"></script>

Links

AdminLTE is available across many stacks — the same template is also offered as official ports for React/Next.js, Vue/Nuxt, Angular, Laravel, Symfony, Django, and ASP.NET Core.


AdminLTE 4 · HTML port Edit on GitHub