ColorlibHQ/AdminLTE v4.5.0

v4.5.0 — The AdminLTE 3 palette, as it was

on GitHub

AdminLTE 4.5.0 adds the one thing 4.4.0's palette couldn't offer: the AdminLTE 3 colours exactly as they were.

The AdminLTE 3 palette, as it was

4.4.0 brought the extra colours back as a palette designed for 4.4 — and some of you liked the originals better. Fair enough. A second opt-in sheet, dist/css/adminlte-colors-v3.css, gives you exactly those: the 18 AdminLTE 3 colours — lightblue, navy, olive, lime, fuchsia, maroon, blue, indigo, purple, pink, red, orange, yellow, green, teal, cyan, gray, gray-dark — with the values from the 3.2 build and v3's text-colour rule (white on lightblue, olive, teal, cyan …; dark on lime, orange, yellow), emitting the same class families as the designed palette: --bs-* tokens with dark-mode variants, .bg-*, .text-bg-*, .text-*, .border-*, .link-*, .bg-gradient-*, .card-*, .callout-*, .direct-chat-*.

The two sheets share class names, so load one of them:

<!-- either the palette designed for 4.4 … -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/admin-lte@4.5.0/dist/css/adminlte-colors.min.css">
<!-- … or the AdminLTE 3 originals -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/admin-lte@4.5.0/dist/css/adminlte-colors-v3.min.css">

• The classic AdminLTE 2 skins come along as presets — skin-blue, -black, -purple, -green, -red, -yellow and their -light variants — as text-bg-* + data-bs-theme on the header and sidebar (text-bg-gray-dark is the exact sidebar-dark-* background).
• UI → Colors and Theme Customize gained a palette switch: swap the stylesheet live and see that palette's tiles, presets and picker options.
• Same Sass underneath: new $lte-palette-contrast: "wcag" | "yiq" knob (plus $lte-palette-yiq-threshold, -text-dark, -text-light), so $lte-palette-custom and $lte-palette-aliases work with the v3 sheet too. npm run palette -- --check and the unit tests keep the v3 map in step.
• Docs: https://adminlte.io/themes/v4/docs/colors.html · demo: https://adminlte.io/themes/v4/UI/colors.html

Requested in #6103 by @johnnyq. adminlte.css and adminlte.js are unchanged.

Also since 4.4.0

• 4.4.1 — the demo's charts follow dark mode: ApexCharts tooltips and axis labels were unreadable on dark cards; every demo page now passes the colour mode to ApexCharts and keeps charts in step when it changes, documented as the “Charts that follow dark mode” recipe (#6105, reported by @Yusk03).

Install

npm install admin-lte@4.5.0

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

Full details in the CHANGELOG.

Full Changelog: v4.4.0...v4.5.0

Full Changelog: v4.4.1...v4.5.0