Getting Started
Overview
Build
Gulp
Webpack
Multi-demo
File Structure
Customization
SASS
Javascript
No jQuery
Video Tutorials
Illustrations
Dark Mode
RTL Version
Layout Builder
Server Side Integration
Blazor
Downloads
Updates
References
Changelog
v8.0.38
Base
Utilities
Helpers
Flex Layouts
Exclusive
Text
Background
Borders
Opacity
Forms
Controls
Advanced
Input Group
Floating Labels
Buttons
Accordion
Alerts
Badges
Breadcrumb
Bullets
Exclusive
Cards
Carousel
Indicator
Exclusive
Modal
Overlay
Exclusive
Pagination
Popovers
Pulse
Exclusive
Rating
Exclusive
Ribbon
Exclusive
Rotate
Exclusive
Separator
Exclusive
Symbol
Exclusive
Tables
Tabs
Toasts
Tooltips
Underline
Forms
Autosize
Clipboard
Date Range Picker
Dialer
Exclusive
DropzoneJS
Flatpickr
FormValidation
Overview
Basic
Advanced
Form Repeater
Overview
Basic
Nested
Advanced
Image Input
Exclusive
Inputmask
Bootstrap Maxlength
Multiselectsplitter
noUiSlider
Password Meter
Exclusive
reCAPTCHA
Select2
Tagify
Editors
CKEditor
Overview
Classic
Inline
Balloon
Balloon Block
Document
Quill
Overview
Basic
Autosave
TinyMCE
Overview
Basic
Plugin Addons
Hidden Menubar
Charts
AmCharts
AmChart Charts
AmChart Maps
AmChart Stock Charts
ApexCharts
ChartJS
Flotcharts
Overview
Basic Chart
Axis Labels
Tracking Curves
Dynamic Chart
Stack Chart Controls
Bar Chart
Pie Chart
Google Charts
Overview
Column Chart
Pie Chart
Line Chart
General
DataTables
Overview
Basic
Advanced
Buttons
Ajax Server Side
Subtable
API
Menu
Overview
Customization
Advanced
API
BlockUI
Exclusive
Cookie
Exclusive
Cookie Alert
CountUp
Cropper
Draggable
Overview
Draggable
Multiple Containers
Swappable
Restricted
Drawer
Exclusive
Fullcalendar
Overview
Basic
Drag-n-Drop
Selectable Dates
Background Events
Localization
Timezone
Fullscreen Lightbox
jKanban Board
Overview
Basic
Colored
Restricted
Rich Content
Fixed Height
jsTree
Overview
Basic Tree
Contextual Menu
Custom Icons
Drag & Drop
Checkable Tree
Ajax Data
Scroll
Exclusive
Scrolltop
Exclusive
Quick Search
Exclusive
Smooth Scroll
Stepper
Exclusive
Sticky
Exclusive
Swapper
Exclusive
SweetAlert
Tiny Slider
Overview
Basic
Advanced
Toastr
Toggle
Exclusive
Typed.js
Vis-Timeline
Overview
Basic
Custom Styling
Groups
Interactions
Templates
Icons
Duotune
Exclusive
Bootstrap Icons
Custom Icons
Font Awesome
Line Awesome
Documentation
v8.0.38
Getting Started
Video Tutorials
Overview
Introduction & Getting Started
Gulp
Automate & enhance your build workflow
Webpack
Module bundler for build process automation
Multi-demo
Multi-demo concept & usage
File Structure
Theme File Structure Organization
SASS
SASS Structure & Customization
Javacript
Javacript Structure & Customization
No jQuery
Remove jQuery from build
Dark Mode
Dark Mode Setup for Layout & Components
Illustrations
Vector Illustrations
Illustrations
Youtube video tutorials
RTL Version
Theme & Bootstrap RTL Version Setup
Blazor
Bootstrap Blazor Server Side Integration
Changelog
Versions & Updates Information
Updates
General Update Guidelines
References
3rd-party Libraries & Resources
Utilities
Extended Bootstrap Utilities
Flex Layouts
Custom Bootstrap Flex Layouts
Text
Extended Bootstrap Text Utilities
Background
Extended Bootstrap Background Utilities
Borders
Extended Bootstrap Border Utilities
Opacity
Extended Bootstrap Opacity Utilities
Controls
Extended Bootstrap Form Controls
Advanced
Advanced Bootstrap Form Controls
Input Group
Extended Bootstrap Input Group
Floating Labels
Extended Bootstrap Floating Labels
Buttons
Extended Bootstrap Buttons
Indicator
Custom Bootstrap Indicator Component
Rotate
Custom Bootstrap Rotate Component
Tables
Extended Bootstrap Tables and DataTable
Cards
Extended Bootstrap Cards
Symbol
Custom Bootstrap Symbol Component For Avatars and Images
Badges
Custom Bootstrap Badge Component
Pulse
Custom Bootstrap Pulse Component
Bullets
Custom Bootstrap Bullet Component
Accordion
Extended Bootstrap Accordion
Carousel
Extended Bootstrap Carousel
Bootstrap Overlay
Custom Bootstrap Overlay Component
Separator
Custom Bootstrap Separator Component
Underline
Custom Bootstrap Underline Component
Tabs
Extended Bootstrap Tabs
Breadcrumb
Customized Bootstrap Breadcrumb
Modal
Customized Bootstrap Modals
Tooltips
Extended Bootstrap Tooltips
Popovers
Extended Bootstrap Popovers
Pagination
Extended Bootstrap Pagination
Rating
Custom Bootstrap Rating Component
Ribbon
Custom Bootstrap Ribbon Component
Alerts
Customized Bootstrap Alerts
Toasts
Extended Bootstrap Toasts
Autosize Textarea
Autosize Textarea Javascript Plugin
Select2
Select2 and Bootstrap Integration
Clipboard
Clipboard.js and Bootstrap integration
Flatpickr
Flatpickr and Bootstrap Integration for Bootstrap Datepicker and Timepicker
Form Repeater Overview
Form Repeater and Bootstrap Integration
Basic Example
Form Repeater Basic Examples
Nested Example
Form Repeater Nested Examples
Nested Example
Form Repeater Nested Examples
FormValidation Overview
FormValidation and Bootstrap Integration
Basic Example
FormValidation Basic Examples
Advanced Example
FormValidation Advanced Examples
Date Range Picker
Bootstrap Datepicker & Timepicker Implementation with Daterangepicker
Tagify
Bootstrap Tags Implementation with Tagify
Dialer
Custom Bootstrap Dialer and Input Spinner Component
noUiSlider
noUiSlider and Bootstrap Integration
Password Meter
Custom Bootstrap Password Meter & Strength Checker Component
Inputmask
Inputmask Plugin & Bootstrap Integration
Bootstrap Multiselectsplitter
Bootstrap Multiselectsplitter Integration
Google reCAPTCHA
Google reCAPTCHA & Bootstrap Integration
DropzoneJS
DropzoneJS & Bootstrap Integration
Image Input
KTImageInput Custom Bootstrap Image Input Component with Thumbnail Preview
Bootstrap Maxlength
A visual feedback indicator for the maxlength attribute.
AmCharts
AmCharts & Bootstrap Integration
AmCharts
AmCharts Maps & Bootstrap Integration
AmCharts
AmCharts Stock & Bootstrap Integration
ApexCharts
ApexCharts & Bootstrap Integration
Chartjs
Chartjs & Bootstrap Integration
Overview
Attractive JavaScript plotting for jQuery
Basic Chart
Flotcharts Basic Examples
Axis Labels
Flotcharts Axis Labels Examples
Tracking Curves
Flotcharts Tracking Curves Examples
Dynamic Chart
Flotcharts Dynamic Chart Examples
Stack Chart Controls
Flotcharts Stack Chart Controls Examples
Bar Chart
Flotcharts Bar Chart Examples
Pie Chart
Flotcharts Pie Chart Examples
Overview
Google Charts Examples
Column Chart
Google Column Charts Examples
Pie Chart
Google Pie Charts Examples
Line Chart
Google Line Charts Examples
Tinymce Overview
Tinymce Editor and Bootstrap Integration
Basic TinyMCE
Tinymce Basic Examples
TinyMCE Plugins
Tinymce Editor Plugins Examples
TinyMCE Menubar
TinyMCE with Hidden Menubar Example
Overview
CKEditor & Bootstrap Integration
CKEditor Classic
CKEditor Classic Examples
CKEditor Inline
CKEditor Inline Examples
CKEditor Ballon
CKEditor Ballon Examples
CKEditor Balloon Block
CKEditor Balloon Block Examples
CKEditor Document
CKEditor Document Examples
Quill Overview
Quill & Bootstrap Integration
Quill Basic
Quill Basic Examples
Quill Autosave
Quill Autosave Examples
DataTables Overview
DataTables & Bootstrap Integration
DataTables
DataTables Basic Examples
DataTables
DataTables Advanced Examples
DataTables
DataTables Buttons Examples
DataTables
DataTables Ajax Server Side Examples
API
DataTables Subtable Examples
API
DataTables API Examples
Draggable Overview
Draggable and Bootstrap Integration
Simple List
Draggable Simple List Examples
Multiple Containers
Draggable Multiple Containers Examples
Swappable
Draggable Swappable Examples
Restricted
Draggable Restricted Examples
Fullscreen Lightbox
Fullscreen Lightbox & Bootstrap Integration
Fullcalendar Overview
Fullcalendar & Bootstrap Integration
Basic
Fullcalendar Basic Examples
Drag-n-Drop
Fullcalendar Drag & Drop Examples
Selectable Dates
Fullcalendar Selectable Dates Examples
Background Events
Fullcalendar Background Events Examples
Localization
Fullcalendar Localization Examples
Timezone
Fullcalendar Timezone Examples
jKanban Overview
jKanban & Bootstrap Integration
Basic
jKanban Basic Examples
Colored
jKanban Colored Items Examples
Restricted
jKanban Restricted Items Examples
Rich Content
jKanban Rich Content Examples
Fixed Height
jKanban Basic Examples
Menu Overview
Customm Bootstrap KTMenu component with Nested Dropdown & Accordion Submenu
Menu Customization
Customm Bootstrap KTMenu component with Nested Dropdown & Accordion Submenu
Menu Advanced
Customm Bootstrap KTMenu component with Nested Dropdown & Accordion Submenu
Menu Api
Customm Bootstrap KTMenu component with Nested Dropdown & Accordion Submenu
Typed.js
Typed.js & Bootstrap Integration
Stepper
Custom Bootstrap Stepper & Wizard Component
Scroll
Custom Bootstrap Scrollbar Component
Cookie
Custom Cookie Component
Cookie Alert
Cookie Alert Component
Cropper
Cropper.js & Bootstrap Integration
Drawer
Custom Bootstrap Offcanvas & Drawer Component
Toastr
Toastr & Bootstrap Integration
BlockUI
BlockUI & Bootstrap Integration
Scrolltop
Custom Bootstrap Scrolltop Component
Search
Custom Bootstrap Quick Search Component
Smooth Scroll
Smooth Scroll and Bootstrap Integration
Sticky
Custom Bootstrap Sticky Component
Swapper
Custom Bootstrap Swapper Component
Sweet Alert
Beautiful Replacement for Javascript Popups
Toggle
Custom Bootstrap Toggle Component
Overview
Vis-timeline & Bootstrap Integration
Basic
Vis-timeline Basic Examples
Custom Styling
Vis-timeline Custom Styling Examples
Group
Vis-timeline Group Examples
Interaction
Vis-timeline Interaction Examples
Templates
Vis-timeline Templates Examples
jsTree Overview
jsTree & Bootstrap Integration
Basic
jsTree Basic Examples
Contextual Menu
jsTree Contextual Menu Examples
Custom Icons
jsTree Custom Icons Examples
Drag & Drop
jsTree Drag & Drop Examples
Checkable Tree
jsTree Checkable Tree Examples
Ajax Data
jsTree Ajax Data Examples
Tiny Slider Overview
Tiny slider for all purposes
Basic
Tiny Slider Basic Example
Custom Navs
Tiny Slider Custom Navigation Example
CountUp
Lightweight JavaScript class that can be used to quickly create animations that display numerical data in a more interesting way.
Duotune
In-house Designed Duotune SVG Icon Set
Bootstrap Icons
Bootstrap Icons and Flaticon Integration
Custom Icons
Custom Font Icons
Fontawesome
Fontawesome Icons and Flaticon Integration
Line Awesome
Line Awesome Icons and Flaticon Integration
Suggestions:
Dark Mode
Dark Mode Setup for Layout & Components
Select2
Select2 and Bootstrap Integration
Flatpickr
Flatpickr and Bootstrap Integration for Bootstrap Datepicker and Timepicker
DataTables
DataTables Ajax Server Side Examples
Fullcalendar Overview
Fullcalendar & Bootstrap Integration
Duotune
In-house Designed Duotune SVG Icon Set
No result found
Please try again with a different query
Preview
Downloads
Purchase
Video Tutorials
Keenthemes Youtube Channel
Video tutorials prepared by our core development team to reveal the best practices utilizing Metronic with your favorite server side language and framework.
2022©
Keenthemes
Explore
Metronic Licenses
License FAQs
Regular License
For single end product used by you or one client
$
39
Extended License
For single SaaS app with paying users
$
969
Custom License
Reach us for custom license offers.
Contact Us
Buy Now
Metronic Demos
Demo 1
Demo 2
Demo 3
Demo 4
Demo 5
Demo 6
Demo 7
Demo 8
Demo 9
Demo 10
Demo 11
Demo 12
Demo 13
Demo 14
Demo 15
Demo 16
Demo 17
Demo 18
Demo 19
Demo 20
Demo 21
Demo 22
Coming soon
Coming soon
Learn & Get Inspired
Support at
devs.keenthemes.com
Join our developers community to find answer to your question and help others.
FAQs
Get Support
Documentation & Videos
From guides and video tutorials, to live demos and code examples to get started.
Plugins & Components
Check out our 300+ in-house components and customized 3rd-party plugins.
Layout Builder
Build your layout, preview it and export the HTML for server side integration.
Metronic Downloads
Download your prefered framework and demo with one click.
What's New
Latest features and improvements added with our users feedback in mind.
Demos
Help
Buy now