Getting Started

Metronic Changelog

Stay updated with the latest enhancements and fixes in Metronic Tailwind CSS HTML & JavaScript Toolkit. This page provides a detailed log of all the changes, including new features, improvements, and bug fixes for each release.

New

KTUI Added KTInputNumber — numeric input helper on native


               input[type="number"]

with optional increment/decrement buttons and events. - Preview

KTSelect Added


               getValue

method for single-select.

KTSelect Added selected count display for multi-select options.

Updates & Improvements

KTDatatable Improved remote data URL resolution to support iframes (


               srcdoc

), SSR, and cross-origin parent contexts without errors. - Preview

KTDatatable Added null-safety guards across checkbox, pagination, providers, and table renderer to prevent runtime crashes. - Preview

KTDropdown Improved null checks and type safety to prevent runtime errors. - Preview

KTSelect Enhanced tag styles and selected count display for better multi-select usability. - Preview

Input Group Enhanced button styling with shadow and border adjustments.

Dependencies Updated @keenthemes/ktui package to version 1.2.5 .

Date Picker Updated custom format examples with long form date representation and adjusted input format. - Preview

Configuration Updated PostCSS configuration to use


               module.exports

syntax.

Security Resolved npm security vulnerabilities by updating


               minimatch

(10.2.1 to 10.2.4) and


               flatted

(3.4.1 to 3.4.2) dependencies.

Infrastructure Removed unused Babel dependencies and cleaned up package configuration.

Infrastructure Removed


               .npmrc

configuration file.

New

Cards Added a context menu to card components. - Preview

FullCalendar Updated the project planning calendar with better event handling, styles, and random demo events. - Preview

Fixes

Date Picker Updated Date Picker Reset/Apply button labels for better language support. - Preview

Updates & Improvements

Dependencies Updated KTUI package versions for v1.2.4 .

KTUI Added support for single component imports (example:


               @keenthemes/ktui/components/toggle-password

). - Preview

KTUI Added new import entrypoints:


               @keenthemes/ktui/core

and


               @keenthemes/ktui/init-all

. - Preview

KTDatatable Optimized KTDatatable for better performance and smoother interactions. - Preview

Initialization Kept old root import behavior working and added clearer import modes (


               @keenthemes/ktui/core

and


               @keenthemes/ktui/init-all

). - Preview

TypeScript Updated exports so strict TypeScript and modern bundlers resolve types correctly. - Preview

Theme Switch Improved Theme Switch toggle and set event handling for better cleanup. - Preview

Toggle Improved Toggle click event handling and cleanup. - Preview

Modal Improved Modal backdrop and content click handling. - Preview

KTSelect Fixed KTSelect build issues by using type-only exports for config and option types. - Preview

Fixes

DataTables.net Fixed a layout issue in DataTables sorting examples. - Preview

Updates & Improvements

DataTables.net Added more DataTables docs examples: empty table, show/hide columns, multi-column sorting, footer totals, row numbers, and French language. - Preview

DataTables.net Removed the striped density DataTables example and related script from docs. - Preview

Angular Updated Angular docs to use


               public/assets

instead of


               src/assets

. - Preview

Date Picker Fixed Date Picker dropdown position when reopened. - Preview

Laravel Livewire Fixed Laravel Livewire sidebar state and theme mode after reload and navigation. - Preview

KTUI Updated to KTUI v1.2.3 with better toggle and theme switch behavior after SPA or Livewire navigation. - Preview

Dependencies Updated package versions, including


               axios

and


               vite

.

New

KTUI KTPinInput supports multi-cell PIN/OTP input, paste, keyboard navigation, and optional hidden field sync. - Preview

KTUI KTCarousel supports prev/next, pagination, thumbnails, autoplay, and better control binding. - Preview

Carousel Added a KTCarousel product details drawer demo with overlay arrows and pagination dots. - Preview

Pin input Added 2FA demos (classic and branded) using KTPinInput and hidden


               verification_code

. - Preview

Updates & Improvements

KTUI Updated to KTUI v1.2.2 in Metronic Tailwind HTML with strictNullChecks and safer types across components. - Preview

New

KTUI Added KTClipboard with copy interactions, icon swap, and tooltip-style feedback (see plugin demos). - Preview

KTUI Added KTRangeSlider with live value/output bindings and examples for basic, stepped bounds, datalist ticks, form integration, and programmatic updates. - Preview

Fixes

Clipboard Improved native clipboard handling in KTBaseLayout and hardened copy behavior.

Updates & Improvements

Clipboard Migrated Clipboard plugin examples/docs from Clipboard.js to native KTClipboard implementation. - Preview

Dependencies Removed Clipboard.js dependency and updated references in docs package manifests.

Testing Enhanced test runner setup and config for v9.4.8 validation.

KTUI Updated KTUI to v1.2.1 with new components and documentation-aligned behavior. - Preview

New

KTRepeater Repeatable form blocks with add trigger, optional limit, and per-item delete.

KTRating Rating component with customizable symbols for star or custom UI.

Input group Example HTML and CSS for select input groups with addons.

AI skills AI skills for components and theming with installation and usage instructions to improve AI-assisted development.

Fixes

Date Picker Fixed MMM month formatting so short month names (e.g. Mar/May/Dec) aren’t corrupted in formatted output. - Preview

Updates & Improvements

KTUI Improved KTUI build command and TypeScript configuration for library output (lib/cjs, lib/esm).

New

DataTables.net Added column filtering with enhanced functionality and UI. - Preview

DataTables.net FixedHeader Added FixedHeader plugin for sticky headers. - Preview

DataTables.net Added scrollable tbody functionality. - Preview

Date Picker Added date parsing and input synchronization . - Preview

Updates & Improvements

DataTables.net Improved scrollable table appearance with borders and background adjustments. - Preview

Dependencies Upgraded minimatch to 10.2.3 and added serialize-javascript at 7.0.3.

Dependencies Updated ajv and related packages.

Dependencies Updated Babel packages and removed clean-webpack-plugin.

Build build:css:watch now monitors all files in the src directory.

New

Build Added chokidar-cli for improved CSS build process.

Updates & Improvements

DataTables Improved DataTables styling with Tailwind CSS integration: custom CSS variables for row selection, hover effects, and responsive design; improved control indicators and sorting icons. - Preview

DataTables Improved DataTables pagination button styles for consistency. - Preview

Security Resolved npm security vulnerabilities.

Axios Upgraded Axios from 1.13.2 to 1.13.5.

Dependencies Updated package.json and package-lock.json with new dependencies; addressed security vulnerabilities.

New

Datatables.net Added Datatables.net integration. - Preview

Updates & Improvements

KTDatatable Added sort arrow indication for active sort direction. - Preview

KTDatatable Added price column sorting (numerical). - Preview

Color Picker Improved save behaviour and input sync . - Preview

Axios Upgraded Axios dependency.

New

Date Picker Added Datepicker preset options. - Preview

Full Calendar Added demo page FullCalendar . - Preview

WYSIWYG Editor Added demo page TinyMCE . - Preview

Dropzone Added demo page Dropzone . - Preview

Canvas Confetti Added Canvas Confetti plugin integration. - Preview

Leaflet Added Leaflet plugin integration. - Preview

Sortable Added Drag and drop (Sortable) plugin integration. - Preview

Fixes

KTSelect Fixed KTSelect issue with long option text in single select. - Preview

New

Full Calendar Added Full Calendar plugin with comprehensive calendar functionality and event management. - Preview

WYSIWYG Editor Added WYSIWYG Editor plugin powered by TinyMCE for rich text editing capabilities. - Preview

Dropzone Added Dropzone plugin for drag-and-drop file uploads with preview and progress tracking. - Preview

Updates & Improvements

KTUI Docs Fixed KTTabs show() method to use button element for proper tab activation. - Preview

Docs Added framework version information for all documentation pages.

Docs Improved global framework integration documentation with enhanced examples and clearer instructions.

New

Color Picker Added Color Picker component with HEX, RGBA, HSLA, HSVA, CMYK support, Hue Slider, Opacity control, and Color Preview. - Preview

Updates & Improvements

Select Improved Select component with new


               closeOnEnter

option to control dropdown closure on Enter key press, new


               closeOnOtherOpen

option to manage multiple dropdowns, search input autofocus, new


               dispatchGlobalEvents

option for event dispatching for jQuery compatibility, optimized dropdown close logic for better performance, and fixed search input persistence after close. - Preview

KtUI Updated KtUI to v1.1.3 with latest improvements. - Preview

Fixes

KTSelect Fixed KTSelect issues including search input persistence after close, Enter key handling to close the dropdown and trigger selection, race conditions, dispatch events for compatibility with jQuery event listeners, single select display to use flexbox for better alignment, search and clear selection button, configuration for closes other open dropdowns before opening new one, and handle long text truncate. - Preview

KTDrawer Fixed KTDrawer issues including drawer positioning within persisted Livewire components and proper z-index stacking. - Preview

KTDatatable Fixed KTDatatable issues including improved instance retrieval logic to prevent duplicate instances. - Preview

Global Components Fixed Global Components issues including default base path and Topbar buttons, drawer and user dropdown unresponsive after wire:navigate partial refresh. - Preview

Updates & Improvements

Date Picker Improved Date Picker with Inline Calendar, Date Picker Popup, Multiple Months Support, Date Range Selection, Time Picker, Time Range Selection, Multiple Dates Selection, Min/Max Dates, Date Formats, Year & Months Pickers, Internationalization Support, Dark Mode, and API Examples. - Preview

Select Improved Select component with new


               closeOnEnter

option to control dropdown closure on Enter key press, new


               closeOnOtherOpen

option to manage multiple dropdowns, search input autofocus, new


               dispatchGlobalEvents

option for event dispatching for jQuery compatibility, optimized dropdown close logic for better performance, and fixed search input persistence after close. - Preview

KtUI Updated KtUI to v1.1.2 with latest improvements. - Preview

Fixes

KTToast Fixed KTToast missing styles. - Preview

Fixes

KTToast Fixed KTToast missing styles. - Preview

Updates & Improvements

Security Update Updated to v9.3.8 with important security patches and improvements.

New

Date Picker Added Date Picker component with Inline Calendar, Date Picker Popup, Multiple Months Support, Date Range Selection, Time Picker, Time Range Selection, Multiple Dates Selection, Min/Max Dates, Date Formats, Year & Months Pickers, Internationalization Support, Dark Mode, and API Examples. - Preview

Updates & Improvements

KtUI Updated KtUI to v1.1.1 with latest improvements. - Preview

Updates & Improvements

KtUI Updated to KtUI v1.0.28 with latest improvements. - Preview

DataTable Improved error handling events for remote data sources. - Preview

Updates & Improvements

KtUI Updated to KtUI v1.0.27 with latest improvements. - Preview

Select Improved Select Dropdown Menu position and positioning logic. - Preview

Modal Enhanced Modal backdrop click handling to prevent modal close on backdrop interaction. - Preview

Updates & Improvements

Datatable Checkbox Improved checkbox state handling and event firing for datatable selections.

Select Enhanced native select element synchronization and improved remote data handling.

Select Improved option handling and dropdown positioning for the select component.

Datatable Added


               requestCredentials

support to datatable configuration for advanced HTTP requests.

Modal Enhanced hide logic for modal component to improve reliability.

New

HTML Starter Kits Added Layout 17 Starter Kit for HTML integration. - Preview

Updates & Improvements

Select New API support for enabling, disabling, updating, and refreshing select components. - Preview

Datatable Documentation improvements and examples. - Preview

Fixes

Select Fixed dark mode issue for select component. - Preview

Select Fixed selected container issue for select component. - Preview

Select Added pre-selected options for remote data source. - Preview

New

HTML Starter Kits Added Layout 15 and Layout 16 Starter Kits for HTML integration. - Preview

Updates & Improvements

Select Fixed Select component to properly handle pre-selected values for remote (async) data sources. - Preview

Updates & Improvements

Select Clear native select options on selection clear. - Preview

Select Select component documentation and examples update. - Preview

Image Input Image Input configuration handling and element selection. - Preview

Select Select search result handling and styles. - Preview

Select Select global configuration API support. - Preview

Select Select modal container example and positioning. - Preview

Select Select native synchronization example. - Preview

Select Select with tags demos. - Preview

Fixes

HTML Starter Kits Fixed Layout 4 starter kit HTML content. - Preview

New

HTML Starter Kits Added Layout 15 Starter Kit for HTML integration. - Preview

HTML Starter Kits Fixed Layout 14 mobile view responsive issue. - Preview

Updates & Improvements

Select Enhanced dropdown with custom container support (e.g.


               body

,


               #modalContainer

, etc.).

Select Added remote data support with search and external API integration.

Fixes

Datatable Fix datatable sorting stop working in modal.

New

HTML Starter Kits Added Layout 14 Starter Kit for HTML integration. - Preview

Fixes

HTML Fixed remote select search results not displaying properly - Preview

HTML Fixed Toast RTL centering and add middle position support - Preview

Updates & Improvements

HTML Improved select option rendering and data mapping for better performance - Preview

HTML Support select for remote data fetching with error handling - Preview

New

Next.js Starter Kits Added Layout 24 Starter Kit for new demo layout. - Preview

Next.js Starter Kits Added Layout 25 Starter Kit for new demo layout. - Preview

Next.js Starter Kits Added Inventory Platform - Customer Management app concept for customer management. - Preview

React Starter Kits Added Layout 24 Starter Kit for new demo layout. - Preview

React Starter Kits Added Layout 25 Starter Kit for new demo layout. - Preview

React Starter Kits Added Inventory Platform - Customer Management app concept for customer management. - Preview

HTML Documentation improvements. - Preview

Fixes

HTML Fixed dropdown closing issue when pressing space key in select component. - Preview

New

DataTable Sorting disable feature for specific columns.

React Starter Kits Added Layout 22 Starter Kit for new demo layout. - Preview

React Starter Kits Added Layout 23 Starter Kit for new demo layout. - Preview

Next.js Starter Kits Added Layout 22 Starter Kit for new demo layout. - Preview

Next.js Starter Kits Added Layout 23 Starter Kit for new demo layout. - Preview

New

React/Next.js Added Store - Inventory App Concept for inventory management. - Preview

React Starter Kits Added Layout 18 Starter Kit for new demo layout. - Preview

React Starter Kits Added Layout 19 Starter Kit for new demo layout. - Preview

React Starter Kits Added Layout 20 Starter Kit for new demo layout. - Preview

Next.js Starter Kits Added Store - Inventory App Concept for inventory management. - Preview

Next.js Starter Kits Added Layout 18 Starter Kit for new demo layout. - Preview

Next.js Starter Kits Added Layout 19 Starter Kit for new demo layout. - Preview

Next.js Starter Kits Added Layout 20 Starter Kit for new demo layout. - Preview

New

React Starter Kits Added 3 New Demo Layouts (Layout-15 through Layout-17) for various use cases. - Preview

Next.js Starter Kits Added 3 New Demo Layouts (Layout-15 through Layout-17) for various use cases. - Preview

New

Core Enhanced KTMenu initialization and cleanup processes for better performance and memory management. - Preview

Core Added Livewire navigation support in KTDom helper for integration with Laravel Livewire applications. - Preview

Components Added preserveParentDropdowns option to enhance menu dropdown behavior and prevent unwanted closing. - Preview

React/Next.js Added Carousel component for image and content slideshows. - Preview

React/Next.js Added Code component for syntax highlighting and code display. - Preview

React/Next.js Added Kanban component for task and project management. - Preview

React/Next.js Added Skeleton with Pattern component for enhanced loading states. - Preview

HTML Starter Kits Added 10 Layout Starter Kits for HTML integration. - Preview

React Starter Kits Added 14 Layout Starter Kits for React integration. - Preview

Next.js Starter Kits Added 14 Layout Starter Kits for Next.js integration. - Preview

Updates & Improvements

Docs Enhanced Angular integration guide with project creation and core integration steps. - Preview

Docs Enhanced Laravel integration guide with improved core and styles integration. - Preview

Docs Added Vue integration guide with download instructions. - Preview

React/Next.js Enhanced user management components including account security, permissions, roles, and user profile management. - Preview

React/Next.js Updated UI components including alert, badge, button, chart, command, context-menu, dialog, github-button, and hover-card. - Preview

React/Next.js Updated package dependencies and configuration files for improved stability and performance.

New

Docs Added Laravel Livewire integration guide for demo1 and demo2. - Preview

Docs Added Blazor Server integration guide for demo1 and demo2. - Preview

Docs Added Flask integration guide for demo1 and demo2. - Preview

Docs Added Django integration guide for demo1 and demo2. - Preview

Docs Added Symfony integration guide for demo1 and demo2. - Preview

Docs Added Asp.Net-Core integration guide for demo1 and demo2. - Preview

Docs Added Ruby on Rails integration guide for demo1 and demo2. - Preview

HTML Starterkit Added Laravel Livewire starterkit for demo1 and demo2. - Preview

HTML Starterkit Added Blazor Server starterkit for demo1 and demo2. - Preview

HTML Starterkit Added Flask starterkit for demo1 and demo2. - Preview

HTML Starterkit Added Django starterkit for demo1 and demo2. - Preview

HTML Starterkit Added Symfony starterkit for demo1 and demo2. - Preview

HTML Starterkit Added Asp.Net-Core starterkit for demo1 and demo2. - Preview

HTML Starterkit Added Ruby on Rails starterkit for demo1 and demo2. - Preview

React/Next.js Added Stepper Component. - Preview

React/Next.js Added File Upload Component. - Preview

React/Next.js Added Tree Component. - Preview

React/Next.js Updated Badge Component to support extended theming. - Preview

React/Next.js Updated Alert Component to support extended theming. - Preview

React/Next.js Added Marquee Component. - Preview

React/Next.js Added GitHub Button Component. - Preview

React/Next.js Added Avatar Group Component. - Preview

React/Next.js Added Typing Text Component. - Preview

React/Next.js Added Word Rotate Component. - Preview

React/Next.js Added Video Text Component. - Preview

React/Next.js Added SVG Text Component. - Preview

React/Next.js Added Counting Number Component. - Preview

React/Next.js Added Sliding Number Component. - Preview

React/Next.js Added Shimmering Text Component. - Preview

React/Next.js Added Text Reveal Component. - Preview

React/Next.js Added Gradient Background Component. - Preview

React/Next.js Added Grid Background Component. - Preview

React/Next.js Added Hover Background Component. - Preview

React/Next.js Improved i18n support. - Preview

Updates & Improvements

HTML When multiple option is enabled, users can select multiple options without the dropdown closing after each selection. - Preview

HTML Enhanced Stepper component to support async validation with step cancellation in change event handlers. - Preview

HTML Enhanced Toast component clearAll method to properly remove containers and prevent stale references. - Preview

React/Next.js Migrated to the new radix-ui package.

React/Next.js Updated package dependencies.

React/Next.js Updated Badge component to support extended theming options. - Preview

React/Next.js Updated Alert component to support extended theming options. - Preview

Next.js Improved i18n support with enhanced internationalization features. - Preview

React Updated Vite version to v7.0.0. Latest Node 22.x is required for this upgrade. - Preview

New

Next.js Added SaaS landing page tempalte. - Preview

Updates & Improvements

Global Upgrade package.json dependencies.

New

HTML Added Advanced Select component. - Preview

HTML Added Toast component. - Preview

React Date & Time picker component. - Preview

React Date Input component. - Preview

React Time Input component. - Preview

React Date & Time Input component. - Preview

Updates & Improvements

Global Upgrade to the latest Tailwind CSS v4.1.7 .

HTML Updated Laravel Integration guide and starterkit for v9.2.x . - Preview

HTML Updated Blazor Integration guide and starterkit for v9.2.x . - Preview

HTML Updated Vue Integration guide and starterkit for v9.2.x . - Preview

Fixes

Global Safari custom scrollbar style issue fixed.

New

Next.js Added Metronic Next.js , a complete Next.js version of Metronic. - Preview

HTML Added Store - Client , a complete HTML e-commerce app for online selling. - Preview

React Added Store - Client , a complete React e-commerce app for online selling. - Preview

Next.js Added Store - Client , a complete Next.js e-commerce app for online selling. - Preview

Next.js Added User Mangement , fully function Next.js app for managing users, accounts and settings. - Preview

Updates & Improvements

Tailwind Global upgrade to Tailwind CSS v4.1.5 . - Preview

HTML Metronic HTML migration to KtUI components. - Preview

React Metronic React migration to ReUI components. - Preview

HTML Metronic v9.1.2 legacy docs deployment. - Preview

New

React Integrated the most popular React UI Toolkit, Shadcn UI with Radix. - Preview

Updates & Improvements

Tailwind Support for latest Tailwind 3.4.15. - Preview

Docs Blazor integration guide improvements. - Preview

Docs Laravel integration guide improvements. - Preview

New

React Complete React version of Metronic 9 Tailwind. - Preview

Pulse Laravel REST API Boilerplate for Metronic 9 React. - Preview

Updates & Improvements

Tailwind Support for latest Tailwind 3.4.14. - Preview

Docs Laravel integration guide improvements. - Preview

Menu Menu component improvements. - Preview

Sticky Sticky component improvements. - Preview

Scrollspy Scrollspy component improvements. - Preview

Fixes

Demo 3 Resolved Sticky content sidebar issue. - Preview

Demo 4 Resolved Sticky content sidebar issue. - Preview

Demo 6 Resolved Sticky content sidebar issue. - Preview

Demo 8 Resolved Sticky content sidebar issue. - Preview

Demo 10 Resolved Sticky content sidebar issue. - Preview

Tooltip Fixed the Tooltip issue with delay settings. - Preview

Updates & Improvements

Docs Laravel integration guide improvements - Preview

Fixes

Tailwind Fixed the incorrect content path in


               tailwind.config.js

. - Preview

Webpack Resolved warnings during the production build with


               npm run build:prod

. - Preview

Demo2 Fixed the issue with incorrect sticky header height calculations. - Preview

Demo7 Fixed the issue with incorrect sticky header height calculations. - Preview

Demo9 Fixed the issue with incorrect sticky header height calculations. - Preview

New

Demo 6 New demo added - Preview

Demo 7 New demo added - Preview

Demo 8 New demo added - Preview

Demo 9 New demo added - Preview

Demo 10 New demo added - Preview

Updates & Improvements

Packages Updated all global dependencies to their latest stable versions in


               package.json

.

Demo 3 Added a sticky scrollable content layout - Preview

Demo 4 Added a sticky scrollable content layout - Preview

Docs React integration guide improvements - Preview

Docs Vue integration guide improvements - Preview

Docs Angular integration guide improvements - Preview

Docs Laravel integration guide improvements - Preview

New

Demo 2 New demo added - Preview

Demo 3 New demo added - Preview

Demo 4 New demo added - Preview

Demo 5 New demo added - Preview

Docs Blazor Server integration guide added - Preview

Starterkit Blazor Server starterkit added - Preview

Updates & Improvements

HTML Added


               antialiased

class to the body tag - More

Docs React integration guide improvements - Preview

Docs Vue integration guide improvements - Preview

Docs Angular integration guide improvements - Preview

Docs Laravel integration guide improvements - Preview

Fixes

Demo 1 Fixed the display issue of the User dropdown(header's right navbar) submenu in mobile mode. - Preview

KTSticky Resolved the offset calculation issue in


               src/core/components/sticky/sticky.ts

. - Preview

New

Docs Next.js integration guide added - Preview

Starterkit Next.js starterkit added - Preview

Updates & Improvements

Docs React integration guide improvements - Preview

Docs Vue integration guide improvements - Preview

Docs Angular integration guide improvements - Preview

Fixes

CSS Resolved CSS errors in


               dist/assets/css/styles.css

.

Updates & Improvements

Docs Angular integration guide enhancements - Preview

Docs React integration guide improvements - Preview

Docs Vue integration guide improvements - Preview

CSS The CSS source for Demo1 has been relocated from


               src/core/plugins/layouts/demo1.js

to


               src/css/demos/demo1.css

.

This change resolves the CSS errors in


                dist/assets/css/styles.css

caused by the PostCSS issue with nested CSS elements.

- More

Fixes

CSS Resolved CSS errors in


               dist/assets/css/styles.css

.

Updates & Improvements

Docs Angular integration guide enhancements - Preview

Docs React integration guide improvements - Preview

Docs Vue integration guide improvements - Preview

SPA Use type-only exports in


               index.spa.ts

.

Package Due to the increasing package size, reaching


               10gb

, the


               Metronic v8.x

package has been moved. - More

Fixes

Components Resolved an issue where the


               transitionEnd

and


               animationEnd

events were not triggered in Firefox.

KTReparent Fixed an issue where the component was not working during the window resize event - Preview

New

Initial Release

Getting Started

Customization

Base Components

Navigation

Forms

3rd-Party Plugins

Metronic Changelog