Get 2024 Templates Mega Bundle!$1000 worth of 19 Bootstrap HTML, Vue & React Templates + 3 Vector Sets for just $99
Get for 99$

Metronic's Roadmap for 2024


Dear Community,

Metronic Evolution is on the way! Redesigned UI, dark mode, MUI Version with Next.js, Vite, Typescript, and a rich component library, plus Tailwind Version with Webpack support and versatile components.

Complete Redesign. Revolutionary redesign with new UI, dark mode, user onboarding, profiles, and more.

  • UI Kit: Complete revamp.
  • Profiles: 10+ diverse options.
  • User Onboarding: Multiple options.
  • Account Settings: 30+ pages.
  • Profile Pages: Over 10 layouts.
  • User Management: Fully reimagined.
  • Community Section: Enhanced interaction.
  • System Pages: Innovative approach.
  • All new Dark mode.


React MUI Version:
  • Next.js support.
  • Vite support.
  • Typescript version.
  • Javascript version.
  • Back-end API.
  • JWT, Auth0 & Firebase.
  • Feature-rich CRUD.
  • 500+ components.
  • Multi-demo concept.
  • Dark & RTL versions.


Tailwind version:
  • Webpack support.
  • 50+ in-house plugins.
  • 500+ components.
  • Frameworks Compatibility.
  • Multi-demo concept.
  • Dark & RTL versions.


<img src="https://i.imgur.com/kBwRhz1.png" class="w-100">


Stay tuned. ;)
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (50)


I would like an Asset mapper version for Symfony, could that be a thing ?



looking forward to it. do you have time frame ?



I waited to long for tailwind version



Hi happy,

Yes, it's going to be a great version with in-house fully native tailwind plugins(buttons, forms, badges, tables, progress, etc) and components(ktmenu, ktaccordion, kttabs, ktmodal, ktdrawer, kttoggle, ktselect, ktdatepicker 40 more in progress).

Stay tuned!

Regards.



Has the release date of Tailwind version been set?



Make a Tailwind version with Vite, not Webpack...



Hi happy,

Sure, we can provide both versions. That's in the plan.

Regards.



Amazing stuff! I also hope in a better and updated Rails version, with the new asset pipeline.



What about a Nuxt.js version?



Hi,

Nuxt.js we will consider after releasing Next.js + Tailwind + MUI Base.

Regards.



Any idea when this will be available for downlod?



Hi,

We are currently fully focused on this and doing our best to release it ASAP in a few months. In this revamp every single element of templates will be fully designed in Figma. It's gonna be a huge work in UI and coding as well.

Regards.



need the next.js version asap!



Hi happy,

It's going to be Next.JS + MUI Base + Tailwind stack!

Regards.



Looking forward to Next.js!



Hi,

Sure, planning to release Next.JS + MUI Base + Tailwind stack as well once we release the base Tailwind HTML version.

Regards.


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(