Official AdminLTE 4 application theme for Drupal — build dashboards, intranets and SaaS app UIs with Bootstrap 5.3, vanilla JS (no jQuery) and light & dark colour modes. Self-contained: all assets are bundled locally, no CDN required. It also works as an admin theme. By Colorlib.
✅ Officially created and maintained by Colorlib — the authors of AdminLTE itself. This is the first-party Drupal port, not a third-party reskin.
Verified on Drupal 11.3 (PHP 8.5): clean install, no errors/warnings in the log, all admin screens render with the AdminLTE shell in both colour modes.
The same AdminLTE 4 dashboard, in the framework you know best — you're looking at the Drupal edition:
Also available as the original AdminLTE (HTML · Bootstrap 5.3 · vanilla JS — demo).
- Drupal 10.3+ or 11
- PHP 8.1+ (as required by your Drupal core version)
- The Bootstrap5 base theme
(
drupal/bootstrap5,^4.0). AdminLTE builds on it for Drupal's core-markup "glue" CSS. Composer pulls it in automatically; for a manual install, download and place it inthemes/contrib/bootstrap5as well. AdminLTE still bundles its own Bootstrap 5.3 build, so Bootstrap5's own CSS/JS is disabled.
While the theme is in beta (no stable release yet), request it explicitly —
Composer's default minimum-stability: stable would otherwise skip pre-releases:
composer require 'drupal/adminlte:^1.0@beta'
drush theme:enable adminlte
drush config:set system.theme admin adminlte # use as the administration themeOnce 1.0.0 stable is released, the plain composer require drupal/adminlte will work.
- Download the theme and extract it into
themes/contrib/adminlte. - Visit Appearance (
/admin/appearance). - Under Uninstalled themes, click Install (or Install and set as default) next to AdminLTE 4.
- To use it only for the admin UI, set it as the Administration theme at
/admin/appearance→ Administration theme.
On enable, the theme ships default block placement (config/install), so the
sidebar menu, navbar, breadcrumbs, tabs, messages and content render immediately.
| Region | AdminLTE location |
|---|---|
navbar_left |
Top navbar, after the sidebar toggle |
navbar_right |
Top navbar, right (account menu, toggle) |
sidebar_brand |
Sidebar header (site logo + name) |
sidebar |
Sidebar treeview menu |
page_title |
Content header (left) |
breadcrumb |
Content header (right) |
highlighted |
Status messages |
help |
Contextual help |
content |
Main content (tabs, actions, page content) |
footer |
App footer |
page_top / page_bottom |
Reserved for core (admin toolbar) |
At /admin/appearance/settings/adminlte:
- Default colour mode —
auto(follow OS),lightordark. Visitors can override it with the navbar toggle; their choice is remembered in the browser. - Dark sidebar — render the sidebar dark regardless of the page colour mode
(applied via
data-bs-theme="dark"on the sidebar). Off by default — the sidebar follows the active light/dark mode unless you enable this. - Start with the sidebar collapsed — render the sidebar collapsed to icons on
first load (adds
sidebar-collapse sidebar-mini). Visitors can still expand it. - Compact mode — tighten spacing across the shell (adds
compact-mode) for information-heavy admin screens. - Force right-to-left (RTL) layout — force
dir="rtl"and the bundled RTL stylesheet on every page. You usually don't need this: for RTL site languages Drupal already loadsadminlte.rtl.cssautomatically (via the.rtl.cssnaming convention). Use the setting only to force RTL on an LTR-language site.
For customisation beyond these settings (colours, spacing, etc.), AdminLTE 4 is driven by CSS variables. To edit CSS without touching theme files or writing a subtheme, the CSS Editor module lets you add custom CSS straight from the admin UI.
AdminLTE works both as a frontend theme (for applications, intranets and
dashboards) and as an administration theme. Two navigation blocks are placed
in the sidebar region on install, so you can pick whichever fits your use case:
- Main navigation — your site's own menu. Use this when AdminLTE is the default (frontend) theme for an app-style site. This is the primary use case.
- Administration — Drupal's admin menu as a collapsible treeview with
per-section icons. Use this when AdminLTE is set as the administration
theme (
/admin/appearance→ Administration theme).
Remove or rearrange either block at /admin/structure/block to suit your build.
| Asset | Notes |
|---|---|
css/adminlte.css |
AdminLTE 4 styles — Bootstrap 5.3 CSS included |
js/adminlte.js |
AdminLTE behaviours (sidebar, treeview) |
js/vendor/bootstrap.bundle.min.js |
Bootstrap 5.3 + Popper |
css/vendor/bootstrap-icons.min.css + fonts |
Bootstrap Icons 1.13 |
css/vendor/source-sans-3.css + fonts |
Source Sans 3 (default body font, weights 300/400/700, OFL) |
Everything is served from the theme — no external CDN calls.
The theme ships a Bootstrap Icons pack for Drupal's Icon API
(adminlte.icons.yml, all ~2,000 icons). It's an optional integration: install
the UI Icons module and enable its
ui_icons_font submodule (the Icon API is in core from 11.1; ui_icons backports
it to 10.3–11.0), and the pack appears in every icon picker — menu-link icons,
CKEditor, fields, etc. — using the already-bundled font. Nothing extra to download,
and the theme works fine without it.
Open docs/components.html in a browser (straight from
the theme folder — no Drupal needed) for a self-contained showcase of the
AdminLTE 4 / Bootstrap 5.3 components this theme provides: buttons, cards,
tables, forms, tabs, pagination, alerts, badges and icons, in both colour modes.
Bootstrap layouts — the theme ships five Bootstrap-grid layouts for
Layout Builder (and the Layout of display modes), grouped under the
AdminLTE category: one column, two columns (½ + ½), content + sidebar
(⅔ + ⅓), three columns and four columns. They emit .row/.col-* markup, so
Layout Builder regions align to the same grid as the rest of the theme — no
extra module required.
Components (SDC / UI Suite) — three signature AdminLTE widgets ship as
Single Directory Components:
small-box, info-box and callout. Use them in any Twig template:
{{ include('adminlte:small-box', {
value: '150', label: 'New orders', icon: 'bag',
color: 'primary', url: '/admin/content'
}) }}They work standalone on core SDC. Install
UI Patterns 2 (drupal/ui_patterns)
to surface them — with auto-generated config forms — in Layout Builder, Views
and field formatters, integrating the theme with the UI Suite ecosystem.
Verified against a clean Drupal 11.3.13 install (standard profile, PHP 8.5):
- All core admin screens (dashboard, content, structure, modules, people, reports, appearance, node add/edit) render with the AdminLTE shell and return HTTP 200.
- No errors or warnings in the Drupal log after a full browse.
- The sidebar shows the Administration menu as a collapsible treeview with per-section icons; the active section is highlighted and auto-expanded.
- Page title, breadcrumb, admin tabs, local actions, status messages, the navbar user dropdown and the site-branding sidebar brand all render correctly.
- Light and dark colour modes, the navbar mode toggle, and coexistence with the
Drupal admin toolbar (using
--drupal-displace-offset-top) all work.
- The bridge CSS covers common form/button/table markup; very complex admin screens (Views UI drag-and-drop, Field UI, Media Library) may benefit from extra styling.
- Gin-style toolbar coexistence is not specifically tuned (core toolbar is).
Issues and patches welcome.
Built on AdminLTE 4 by Colorlib. Drupal theme requested in ColorlibHQ/AdminLTE#6057.
GPL-2.0-or-later, per Drupal.org requirements. Bundled AdminLTE, Bootstrap and Bootstrap Icons assets are MIT (GPL-compatible). See LICENSE.