Metronic 9

Tailwind CSS Toolkit

A complete toolkit of 1000+ UI components
built with Tailwind for HTML JavaScript and React,
to build scalable web apps faster than ever.

Pre-built Demos & Layouts

10 unique HTML and React demos showcasing advanced layout
features built with Tailwind CSS.

Demo 1  - Default

Demo 2  - Horizontal Menu

Demo 3  - Compact Sidebar

Demo 4  - Two-column Sidebar

Demo 5  - Dual-row Header

Demo 6  - Multiple Menus

Demo 7  - Advanced Mega-menu

Demo 8  - Dropdown Menu

Demo 9  - Exrtended Header

Demo 10  - Dark Sidebar

Pages & Components

Over 100 pages, 40+ components and 1000+
UI elements built with Tailwind CSS for HTML & React.

Public Profile

Gamer Profile

Company Profile

Projects - Columns

Projects - Rows

Team Profile

User Profile

Account Settings

Account Starter

Basic Billing

Billing Plans

Security Overview

Backup Recovery

Teams Listing

Team Info

Notifications Settings

Account Integrations

User Cards - NFT

Team Members

Team Crew

Sign In Form

2-factor Authentication

404 Page

500 Page

Account Advanced Settings

Company Profile

Account Appearance Settings

API Settings

Import Members

Security Logs

Profile Activity

Team Starter

Enterprise Settings

Tailwind CSS Based

One Scalable Foundation

Metronic is a comprehensive toolkit of UI components built with Tailwind CSS,
enabling you to create modern, scalable web applications.

Theming

Customize colors and styles for a unique UI experience, matching your brand identity and user preferences.
View

UI Elements

Essential components for creating visually appealing interfaces that enhance user interactions.
View

Navigations

Flexible navigation components for an intuitive user experience, helping users find their way easily.
View

Menus

Adaptable menu options to improve user interaction, providing easy access to various features.
View

Forms

Customizable form elements for efficient data collection, enhancing accuracy and user experience.
View

Datatables

Robust tables for organizing and displaying data effectively, enhancing data management and analysis.
View

Overlays

Overlay components for enhanced visual effects, providing additional context and interactivity to users.
View

Feedback

Interactive feedback components like notifications and alerts to keep users informed and engaged.
View

Cards

Stylish card layouts for presenting content and data in an organized and visually appealing manner.
View

Users

User profile components to manage personal information and settings in a comprehensive interface.
View

Icons

Extensive icon library to enhance the visual appeal and intuitiveness of your application, making it more user-friendly.
View

Charts

Advanced charting tools for dynamic, interactive data visualization, providing valuable insights and analytics.
View

Trust Driven by

11 Years of Innovations

Enterprise grade  and cut-price solution for web apps of  any size 
coupled with the de-facto frameworks and familiar tools
Trusted By
0
Rated 5 Stars
0
End Users
0
On Theme Market
0

Pricing

Flexible License Options

Choose the right license for your needs
and enjoy lifetime free updates

Regular License

Use, by you or one client, in a single end product for which end users are not charged.

49$
Premium support
Unlimited developers
Lifetime free updates
Full source code
Figma design file
Refund guarantee
Paying users(SaaS)

Extended License

Use by you or your one client in a single end product for which end users can be charged.

969$
Premium support
Unlimited developers
Lifetime free updates
Full source code
Figma design file
Refund guarantee
Paying users(SaaS)

Custom License

Using Metronic for large-scale enterprise projects and need a custom license model? Contact us to obtain a tailored license that fits your business needs.

Frequently Asked Questions

General

Metronic is an All-in-One Tailwind & Bootstrap based Toolkit for web apps and sites, featuring pre-built designs, layouts, and components using both Tailwind and Bootstrap as UI foundations. Since its launch in 2013, Metronic has become the most popular Admin Dashboard Theme, powering by over 115,000 projects and used by more than 100 million end users daily.

Metronic provides professional-grade design and pre-built HTML templates, allowing you to focus more on implementing the backend logic according to your project requirements. It streamlines the frontend development process, offering a polished, ready-to-use UI, so you can save time and resources while ensuring a high-quality user experience.

Great question! Hiring a mid-level designer and developer can easily cost over $5,000 per month each, not to mention the time and effort required for management and testing their work. Plus, there may not always be enough work to keep them fully engaged, leaving you paying for downtime.

Metronic offers a cost-effective alternative—a feature-rich, ready-to-use toolkit that delivers the same level of quality and functionality that would otherwise cost over $100,000 to build from scratch. Our customers consistently highlight the value, flexibility, and efficiency Metronic brings, saving significant time, money, and resources.

Yes, Metronic can be used for commercial client projects as long as you comply with the license terms. Over the past 11 years, Metronic has been chosen by enterprises and organizations such as Deloitte, Vodafone, and Harvard University, making it a trusted solution for high-profile projects across industries.

No, Metronic cannot be used for open-source projects as each use of Metronic requires a separate license and the source code, including Metronic, cannot be distributed publicly.

Absolutely! Metronic is designed to be user-friendly for developers of all levels. It comes with comprehensive documentation and a variety of examples to help beginners get started quickly. Our intuitive design and well-structured codebase make it easy to understand and customize. Plus, our support team is always ready to assist you with any questions you may have.

**Yes,** Metronic includes extensive documentation covering all aspects of the toolkit, from installation to advanced customization. We provide Step-by-step Guides, code examples, and best practices to help you make the most of Metronic's features.

Metronic is updated regularly, following a structured development roadmap and incorporating valuable user feedback. Since its launch in 2013, we have released hundreds of high-quality updates, continually enhancing the product to meet the evolving needs of our users.

Metronic's primary verison is HTML/JavaScript and other versions such as React, Vue, Angular, Laravel, etc are separate versiosn includes limited features from the HTML version.

Metronic 8 and Metronic 9 are two separate versions of Metronic, both available upon purchase. Metronic 8 is built on the Bootstrap framework, and its features can be explored in the Metronic 8 Live Preview. Metronic 9, on the other hand, is the newly released version based on Tailwind CSS, and all of its features can be viewed in the Metronic 9 Live Preview.

The Metronic 9 Tailwind version currently offers an HTML/JavaScript edition, featuring over 100 pages, 10 unique demos, and more than 1000 UI elements and components. In the coming weeks, the Metronic 9 Tailwind React + MUI Base version will be released, bringing all the features of the HTML version natively to React.

While we do not offer a downloadable trial version, you can explore Metronic's extensive features through our live previews: - Metronic 8 Live Preview - Metronic 9 Live Preview.  These previews allow you to experience the UI components, layouts, and functionality before making a purchase.

License

No, you do not need to install the license anywhere. The license serves as proof of your legal usage of Metronic for your projects and is not required to be installed or activated.

A single license can be used for one production deployment and unlimited testing and development environments. However, each unique production deployment needs its own license.

Yes, a single license allows the use of Metronic in a project where users log in from a central domain and access different modules via subdomains.

No, both licenses receive the same level of support from KeenThemes. For more information, visit the Support Policy.

If your end product is distributed or set up on-premise in large numbers, a Custom License would be the best choice. Custom Licenses offer flexibility for scenarios that exceed standard license terms, such as mass distribution, OEM partnerships, or inclusion in proprietary systems. This ensures compliance and provides the legal framework needed for large-scale deployments. Please contact us to discuss your specific requirements, and we'll tailor a licensing solution that fits your needs. To request a custom license quotation please Contact Us.

License purchases include ongoing updates, ensuring you have access to the latest features and improvements.

Yes, licenses can be transferred if the end product's use remains consistent with the license terms.

You can purchase a license for the latest version of Metronic, which is valid for any previous version as well. Additionally, you can download older versions from a private Google Drive link, provided in the README.MD file included in the ThemeForest download package of Metronic.

Each site or project requires its own license, although Custom Licensing options are available for large-scale use.

Yes, each Metronic license comes with lifetime free updates, allowing you access to the latest features and improvements without additional cost.

Usage

Yes, you receive general theme support through our Support Center channel. For more details, please review our Support Policy.

All the features shown on the Metronic Preview Site are included in the package.

Due to the significant size of the Metronic 8 package, which has now grown to 10GB, we've moved all Bootstrap demos and starter kits to a private Google Drive folder to avoid slow download issues. You can find the Google Drive link in the README.md file included in the ThemeForest download package.

Metronic can be used for multi-tenant applications, such as SaaS, where multiple end-users can create separate accounts, but this requires an Extended License.

Licensing for inclusion in a hardware product depends on the nature of the product and how Metronic is used. It is best to consult with KeenThemes for such specific use cases and learn more about Custom License options.

Yes, an eCommerce site can operate under a Regular License if the site itself is not selling the Metronic theme or a product that includes the theme as part of its packaged software.

These tools are required to compile the CSS/JS code from the src folder when you customize the theme. You use it for local development only, no need to install them on your production server. These tools are used to handle the assets during development, for example, if you change the theme colors or edit the JS code.

Refund

Yes, we provide refunds in accordance with the eligibility criteria outlined in ThemeForest’s Refund Policy. To request a refund, simply follow this link: Submit Refund Request.

Usually, we review and approve refund requests within a day, and the refund payout will take up to several days depending on ThemeForest and your payment method.

“Metronic was one of the best decisions we made when we started developing ASP.NET Zero. As .NET backend developers, Metronic was so easy-to-use and streamlined our development processes whilst making it possible for us to create a good-looking, stable and user-friendly frontend. Metronic helped us to reach the market quickly, which was one of the key points of our success.
Additionally, Metronic has different UI options like Angular, Blazor, React, etc... and many components which are used by industry leader enterprise app. This also allowed us to develop our app with no need to use a component library. Another good point is, Metronic has very thorough documentation and many real-life samples. When we needed to develop a new feature, documentation and samples helped us in a great manner.“
“The impact of the Metronic 8 theme on our frontend development is overwhelming. We were skeptical at first, because we had to REWRITE the frontend due to another theme. But working with a component based approach did not deliver us a good design as well. After weeks of comparing, we opted for the Metronic theme. The main points we considered were overall design, performance, Bootstrap, Angular, React and Vue.js support.
Last but not least, you need great performance for customer satisfaction. That is why we try to load as few libraries as possible. Therefore, just depend on the Metronic 8 theme and use pure javascript to avoid using JQuery. The community and support is great, so try it yourself!“
Would you need
a Custom License ?
Get a free quote for a custom license that allows using Metronic in your project with an unlimited number of distributions.
How about
a Custom Project ?
Since 2012, we have helped startups, blue chip companies and government agencies and successfully delivered over 120 custom projects.
Docs Get Help Buy Now