30 Free Vue.js Admin and Dashboard Templates
Tags: vue, webdev, javascript, html
Published: 2021-11-23 11:46:58

After the very good result of this [article](https://dev.to/markc86/50-awesome-vuejs-templates-and-themes-1pln) where I have published some of my favorite premium resources based on Vuejs, today I would like to share with you a selection of gorgeous and 100% open-source admin dashboard templates and themes to help you kickstart your next web interface project!

There is a wide range of open-source projects to help you give your web app a more professional design touch, but here I collected only the ones (that you can evaluate yourself freely) that follows strict quality criteria. Precisely, they are chosen according to the following standards: 

- Clean-looking code
- Thorough descriptions
- Small size (compressed)
- Rich features (but not bloated)
- Attractive design (aesthetic sense).

All these templates are intended to be used as an entry point for developers who want to speed up their design process (so you can say goodbye to working with design tools such as Figma or Sketch), and they are published under the MIT license, meaning you are free to use them however you'd like even in commercial applications or client projects. 

---

###1. Mosaic Lite Vue
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/t7qdg8ozvyl76qf81w42.jpg)

**[Live Demo](https://mosaic-vue.cruip.com/)** / **[Download](https://github.com/cruip/vuejs-admin-dashboard-template)**

Mosaic is the perfect admin dashboard template to get started with your next project. Built on top of the popular [Mosaic](https://cruip.com/mosaic/) template, it's designed for companies of any size in any industry. It features hundreds of pre-built pages and sections, and its modular style layout can be used for both backend & frontend applications. Additional features include multiple full-screen segments that can be used independently or in tandem to craft unique experiences.

Features:

- Interactive graphs and charts
- Accessible based workflow
- Lifetime free updates

---

###2. Start Vue Free
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bxpsg6rcv1pz426t1n1p.jpg)

**[Live Demo](https://preview.keenthemes.com/start-vue-free/#/dashboards/start)** / **[Download](https://keenthemes.com/products/start-vue-free)**

Start Vue Free is a beautiful and elegant theme developed by KeenThemes specifically for VueJS and Bootstrap enthusiasts. This theme has a fully responsive layout that can be used "as is" to build stunning and functional web applications that work on desktops, smartphones, and tablets. The theme installs in minutes and comes with dozens of components, plugins, and grid systems to help get you started.

Features:

- 100% free theme
- Image gallery and search panel
- Cross-browser tested

---

###3. Materio Free
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bgq6e2d5r4zapf63sm30.jpg)

**[Live Demo](https://themeselection.com/demo/materio-vuetify-vuejs-admin-template-free/demo/dashboard)** / **[Download](https://themeselection.com/products/materio-free-vuetify-vuejs-admin-template/)**

Materio Free is a futuristic Vue admin dashboard template built with the latest advancements in hybrid app building. The team aimed to bring it to you in its most straightforward form by offering a wealth of customisable elements, a clean and highly adaptable UI/UX design, and access to native-like performance on any device type or platform. All of this means that you will have true power over your creations while working with a framework that gives you total flexibility.

Features:

- Custom made 3D illustrations
- Fully functional cards
- Simple from elements

---

###4. Muse
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/txw6uurvotem1ntnak2c.jpg)

**[Live Demo](https://demos.creative-tim.com/muse-vue-ant-design-dashboard/#/dashboard)** / **[Download](https://github.com/creativetimofficial/muse-vue-ant-design-dashboard)**

Muse is a beautiful free Vue.js admin dashboard template, structurally based on the principles of Ant Design. It comes with a growing set of fine-tuned components intentionally designed to create a stunning visual style using pre-made blocks and pages. The combination of minimalism and high functionality makes it perfect for business dashboards, and the Muse Builder allows you to decide how much you want from the finished product in terms of its look and functionality. 
Features:

- Premium version available
- Documentation on all available components
- Toast notifications

---

###5. Rider Vue Free
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ed1odmdwt9469ciohdqz.jpg)

**[Live Demo](https://preview.keenthemes.com/rider-vue-free/#/dashboard)** / **[Download](https://keenthemes.com/products/rider-vue-free)**

Rider Vue Free is a free Vue dashboard template built with unlimited possibilities. Its exceptional design is perfectly crafted for optimized products to suit every modern web request. Rider Vue Free is based on the ultimate mega theme for VueJS development starters and for those who don't have enough money to pay for premium templates or want to save money. With endless UI components, gorgeous design, robust layouts, and zero price tag, that's what you get with this free template.

Features:

- Bootstrapped form wizard
- Max width validator
- Advanced data tables

---

###6. Vue Ant Admin
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mthc8700gwt6w5oylh9w.jpg)

**[Live Demo](https://iczer.gitee.io/vue-antd-admin/#/dashboard/workplace)** / **[Download](https://github.com/iczer/vue-antd-admin)**

Looking for a functional and beautiful admin dashboard template with Vue and Ant Design Pro's implementation? We got you covered! This modern dashboard template has an elegant design with a clean layout and a minimal background to cover several professional features such as speaker icons, social media icons, and the option to choose between dark or light environments. This template includes two main applications to make your life easier during the customisation flow.
Features:

- Over 2K stars on Github
- No packages published
- Accepts contributions 

---

###7. Star Admin Vue
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/0oqw5qc2zoyp0yemrh5u.jpg)

**[Live Demo](https://www.bootstrapdash.com/demo/star-admin-vue/preview/#/)** / **[Download](https://github.com/BootstrapDash/StarAdmin-Free-Vue-Admin-Template)**

Star Admin Vue Admin Template is a free admin template based on Bootstrap 4 and Vue.js. This theme uses the Bootstrap-Vue framework and makes it easy to build functional apps with Vue. The exceptionally flexible set of dynamic elements helps you create an amazing user interface for your admin panel packed with over 30 UI components polished by a dedicated team of designers behind the project.

Features:

- Multiple file uploads
- Vector maps and widgets
- Detached sidebar Layout

---

###8. Purple Free Vue
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/memut94xuukg0hge6yq8.jpg)

**[Live Demo](https://www.bootstrapdash.com/demo/purple-free-vue/preview/demo_1/)** / **[Download](https://github.com/BootstrapDash/purple-free-vue-admin-template)**

Open your door to the world of dashboards by exploring Purple Free Vue - the free version of one of the most popular admin dashboard templates built with Vue.js - Purple. Built with the latest web technologies, including Vue.js, this free template will make it easy to get started with building your own dashboards, and as tradition demands, it comes with a transparent MIT license and uses syntax on all the projects.

Features:

- Social Feed
- Lock Screen with two variations
- Sample dashboards

---

###9. Vue Material Free
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/hnstef96libxpdc19lpx.jpg)

**[Live Demo](https://flatlogic.github.io/material-vue/#/dashboard)** / **[Download](https://github.com/flatlogic/material-vue)**

Built with the Vuetify library, Vue Material Free is an open-source dashboard template for building interactive material-style design dashboard products. Once installed, it lets you quickly create a unique and interactive interface environment, with automatic layouts based on window size, touch-enabled communication widgets, and internationalisation support connected with the back-end. The Vue architecture allows for an easy transition to the patterns making it easy to adapt things on the fly.

Features:

- Styled Vuetify components
- Vue Apex charts
- Functional login and logout

---

###10. Sing App Vue
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/t12k5fzle6kowev9ot2k.jpg)

**[Live Demo](https://flatlogic.github.io/sing-app-vue-dashboard/#/app/dashboard)** / **[Download](https://github.com/flatlogic/sing-app-vue-dashboard)**

No matter if you run a small business or a large company, visualising your data is a great tool to see your goals and results instantly. Sing App Vue dashboard is a free and open-source admin dashboard template released with Bootstrap and Vue.js. By using this template you will leverage lots of built-in components and thus focus on building features that set you apart from competitors rather than developing everything from scratch. Turn your simple data into attractive charts on a real-time basis with Sing App Vue Dashboard.

Features:

- Customer relationship management
- Social media metrics
- Customised web platform

---

###11. Vue Black Dashboard
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/paoe9h1t8jid9r1jjx5n.jpg)

**[Live Demo](https://demos.creative-tim.com/vue-black-dashboard/#/dashboard)** / **[Download](https://www.creative-tim.com/product/vue-black-dashboard)**

Vue Black Dashboard is a beautiful Vue.js admin dashboard template built to fit together and look amazing on any browser and device. Designed with all plugins you might need to start any project, Vue Black Dashboard features over 16 individual components, spacious cards, and gorgeous graphics to give you the freedom of choosing and combining multiple layouts into one while keeping all the benefits of an all-in-one production-ready product.

Features:

- Easily modify SASS files
- Advanced modals
- Code & UI Visualisation

---

###12. Monster Admin Lite
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/3xqaq1h1n6z4mrt7l4mu.jpg)

**[Live Demo](https://demos.wrappixel.com/free-admin-templates/vuejs/monster-vuejs-free/main/starter)** / **[Download](https://www.wrappixel.com/templates/monster-bootstrap-vue-admin-lite/)**

Monster Admin Lite is a VueJS-based dashboard template, created by the organisation of WrapPixel. This template comes as a single-page web application template that is built with the latest trends and stack that use the power of Vue to render a fantastic user experience. By adding admin control to your current project, you'll get a complete web existence without struggling to code a different layout for each page.

Features:

- Responsive and adaptive
- Sticky header
- Aside navigation

---

###13. MaterialPro Vuetify Admin Lite
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/b68wpllnp4v4bdxcu2sh.jpg)

**[Live Demo](https://demos.wrappixel.com/free-admin-templates/vuejs/materialpro-vuejs-free/main/#/dashboard/basic-dashboard)** / **[Download](https://www.wrappixel.com/templates/materialpro-vuetify-admin-lite/#comparison)**

MaterialPro Vuejs Admin Lite is a beautiful Material-based admin dashboard template made for business, marketing, analytics, eCommerce, app monitor, and tracking tools. Being very easy to use and highly adaptable it has everything you need to build your app backend in an efficient way. It comes with some nicely designed page templates that will make your life much easier when you are creating your next project or web solution.

Features:

- Premium form validation
- Advanced interaction controls
- Simple and flexible charting

---

###14. Shards
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/87ixcndgppxkfxnkln4y.jpg)

**[Live Demo](https://designrevision.com/demo/shards-dashboard-lite-vue/blog-overview)** / **[Download](https://designrevision.com/downloads/shards-dashboard-lite-vue/)**

The goal of the Shards dashboard template is to provide a modern, easily extensible Vue foundation for your dashboard development. It's a production-ready product that you can use as a starting point to build a fully functional, data-driven application. This template provides a modular foundation that can be easily extended to fit almost any type of development environment, and it's well documented so you can start building impressive user interfaces right away.

Features:

- Solid design System
- Access to updates
- Source Sketch design files

---

###15. Extreme
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/cgs4q3rca2tsnwww6imp.jpg)

**[Live Demo](https://demos.wrappixel.com/free-admin-templates/vuejs/xtreme-vuejs-free/main/#/starterkit)** / **[Download](https://www.wrappixel.com/templates/xtreme-vuesax-admin-lite/)**

Extreme is a free VueJS dashboard template by WrapPixel. With Extreme, you can build a complete web experience without compromising accessibility and by simply adding admin control to your current app. Some key features of this beautiful responsive dashboard template are multiple charts together that helps you understand relationships between variables, an easy way to visualise any data from your app in "single page mode", the block of data builder that will help you track and scan users' activity across 1+ web apps. 

Features:

- Animate scrolling to anchor links
- Open source icon library 
- Powerful tag component

---

###16. Vue Argon Dashboard
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tuiyili6b4ul2llfyxdr.jpg)

**[Live Demo](https://demos.creative-tim.com/vue-argon-dashboard/#/dashboard)** / **[Download](https://www.creative-tim.com/product/vue-argon-dashboard)**

Vue Argon Dashboard is a great starting point for developers that want to build websites using popular technologies like Bootstrap 4 and Vue.js. The set contains high-quality and free-to-use components such as forms, modal windows, tabs, cards, navigation menus, and much more. This template aimed to avoid reinventing the wheel and focus on building a useful dashboard that we all need to perform our daily tasks most efficiently.

Features:

- Proptypes checking for all components
- Interactive and functional demos
- Built-in packages

---

###17. Corona Vue Free
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/u9mgjfjmt7sag6qr3atv.jpg)

**[Live Demo](https://bootstrapdash.com/demo/corona-vue-free/preview/demo_1/)** / **[Download](https://github.com/BootstrapDash/corona-vue-free-admin-template)**

In love with dark mode? Let me present you Corona Vue, now available for free and fully downloadable via Github. Don’t let the name scare you, Corona is a sleek, stylish, and sexy new admin dashboard from BootstrapDash that is super easy to customize and launch. This is one of the most popular admin dashboard templates on the market, and the open-source version has enough features to let you kickstart anything with the power of the fabulous web.

Features:

- Full source code of the theme
- Social map page
- Multiple 3 user card variants

---

###18. Vue White Dashboard
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/vwfh8fq8hd5da8nro4pn.jpg)

**[Live Demo](https://demos.creative-tim.com/vue-white-dashboard/#/dashboard)** / **[Download](https://www.creative-tim.com/product/vue-white-dashboard)**

Vue White Dashboard is a free and premium dashboard template developed as a solid alternative to the popular Vue Black Dashboard. This template opens its doors to new prospects who want to create beautiful user experiences without wading through the intricate structure of JavaScript. It is the number one choice for beginners, as it is entirely open-source and available on GitHub - right on the developer's doorstep.

Features:

- Easy development
- Webpack based layout
- 5+ Timepickers

---

###19. Admin Base Template
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/jn8osu3kvzcfsdo8e5j8.jpg)

**[Live Demo](https://admin.senseui.im/#/dashboard)** / **[Download](https://github.com/liangyuetian/elementuivue2to3)**

Admin base is a free admin template built using Vue.js, Vite, Element UI, and Typescript. These extraordinary technology stacks start up a world of possibilities by giving you a highly flexible admin template that can be used to build structural panels for any application, big or small. Admin base comes with lots of pre-built functionalities (available out the box) such as permission systems, permission rules, filters, charts, and so on.

Features:

- Email details page
- Maintenance panel
- Product listing

---

###20. AatroX
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zsd79ofpfi995pcmhz2h.jpg)

**[Live Demo](https://aatrox-vue-free.netlify.app/dashboards/dashboard-version-one)** / **[Download](https://github.com/uilibrary/AatroX-vue)**

Aatrox is a highly customisable and feature-rich Vue admin dashboard template that can be used to create any application you desire with no effort. Aatrox will help you achieve the startup of your dreams with a stylish and clean admin database that will entice and impress your users and investors. With maximum convenience and flexibility, you'll be able to develop faster, make changes faster, and launch faster. It's time for you to get back the world.

Features:

- Accessible routing
- Production ready
- Vue 3 & Vite

---

###21. ArchitectUI Dashboard Vue Free
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/oq9ane92gyahh15n3ylm.jpg)

**[Live Demo](https://dashboardpack.com/live-demo-free/?livedemo=2385)** / **[Download](https://dashboardpack.com/theme-details/architectui-dashboard-vue-free/)**

As a base admin dashboard template, ArchitectUI Vue is powered by Vue.js version 3.4.1. It contains 15 handpicked widgets and components that are perfectly integrated with each other in order to create a common visual design language. In order to use this template, you’ll need at least a few basic coding skills, but don’t worry, this template has pretty straightforward coding and uses Vue Router for the navigation links.

Features:

- Easy layout modifiers
- Multiple color schemes
- 9+ Dashboards

---

###22. AdminPro VueJs Lite
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/aeilnotav89f6v854h2a.jpg)

**[Live Demo](https://demos.wrappixel.com/free-admin-templates/vuejs/adminpro-vuejs-free/main/#/dashboard/basic-dashboard)** / **[Download](https://www.wrappixel.com/templates/adminpro-vuetify-admin-lite/)**

Introducing AdminPro VueJs Lite, a stylish Vue.js admin dashboard template that is great for users who are looking to build CRM systems and management platforms in a visually appealing way. This template comes with a superb design system integrated into a responsive navigation system with loading indicators, lightbox, icons (with retina support), router state transitions, beautiful animations, color schemes, and typography.

Features:

- Real-time previews
- Quick guides with code examples
- Business ready modals

---

###23. Vuetify Admin
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/v8utr6d2n275iegwlbnd.jpg)

**[Live Demo](https://va-demo.okami101.io/admin/dashboard)** / **[Download](https://github.com/okami101/vuetify-admin)**

Vuetify Admin is the perfect frontend admin template for building highly responsive, scalable admin dashboards. This Vue.js-based UI component pack provides you with all components that are required, even the common ones to make your next digital product stand out! In terms of the tech stack, it comes with a built-in Vue.js theme plugin and works seamlessly with REST APIs - a dedicated code environment for fast shipping.

Features:

- Storage manager app
- Event management view
- Fullcalendar plugin

---

###24. Vue Element Admin
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/u2cjonpud837n1fg1oey.jpg)

**[Live Demo](https://panjiachen.github.io/vue-element-admin/#/dashboard)** / **[Download](https://github.com/PanJiaChen/vue-element-admin)**

I’m very excited to share with you the new major release of Vue Element Admin! Vue Element Admin is a powerful responsive admin template based on the latest development stack of Vue, and it has a built-in i18n solution, typical templates for enterprise applications, and some other incredible features. It is 100% compatible with Mock.js, and it means that you no longer have to use any confusing UI framework while keeping your code super optimized and easy to maintain. I believe whatever your needs are, this project will help you.

Features:

- Directive permission
- Multi-environment build
- Multiple dynamic themes

---

###25. CoreUI
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/p9o48cxzxyayhnvling4.jpg)

**[Live Demo](https://coreui.io/vue/demo/4.0/free/#/dashboard)** / **[Download](https://coreui.io/vue/)**

CoreUI has designed over 50 attractive, fresh, and modern Vue.js UI components with clean code. Each component can be used separately or in any combination to create complex applications. I'm pretty confident that once used CoreUI will become your most valuable asset, and the reason for saying this, is that it will help you significantly cut development time by creating simple, customisable, types of layouts that are already styled according to your taste. Give CoreUI a try and I'm sure that won't regret it. 

Features:

- No design skills required
- SCSS source files
- Human tech support

---

###26. Admin One
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/owzeg6mjut8khzxkffm9.jpg)

**[Live Demo](https://justboil.github.io/admin-one-vue-tailwind/#/)** / **[Download](https://github.com/justboil/admin-one-vue-tailwind)**

Admin One is a manageable and beautiful, admin dashboard template built with Vue.js 3  and Tailwind CSS. The most convenient elements are included with Admin One Free, however also provides a huge amount of customisation options for those with a little more time. I believe Admin One is most suited to those who want an admin dashboard template, but have little to no front-end or design experience. This FREE version comes with a ton of features without the need for a third-party license key.

Features:

- Advanced version available
- 100% adaptive & responsive
- Quick search form

---

###27. Light Blue Vue Admin
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xozgzynrq69x2srmguog.jpg)

**[Live Demo](https://flatlogic.github.io/light-blue-vue-admin/#/app/dashboard)** / **[Download](https://flatlogic.com/templates/light-blue-vue-lite)**

Light Blue Vue is an admin template built with Vue JS (Vue CLI) and Bootstrap 4. Unique inconspicuous design with slightly transparent widgets and gradient background make this Vue JS template a rare visual gem among other similar products and resources. With Light Blue, it becomes much easier to build a management interface for your IoT dashboard, SAAS startup, booking management system, or any other web app that requires built-in functionalities and multiple authentication options.

Features:

- Multiselect components
- Documentation & tooling
- Basic form elements

---

###28. Vuestic Admin
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/diysr16lsosry6urn521.jpg)

**[Live Demo](https://vuestic.epicmax.co/admin/dashboard)** / **[Download](https://flatlogic.com/templates/vuestic-vue-free-admin)**

Vuestic is an elegant Vue.js admin template for development teams crafted with love. This minimal-based dashboard template built with Webpack & SASS can be used to create powerful sub-projects management tools, project tracking systems, sophisticated CRMs, knowledgebase systems, and many other administration panels. The Vuestic admin template was founded on the motivation to get the code-quality to rock-star level, but have it still be familiar enough to be accessible early on in your project. 

Features:

- Original and corporate color scheme
- Expansion cards
- Client Billing and contact

---

###29. Arbano
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tdh1exev6cms7yim103s.jpg)

**[Live Demo](https://preview.vuejsadmin.com/item/arbano)** / **[Download](https://vuejsadmin.com/product/arbano/)**

Arbano is a free admin template built with Bootstrap 4 and VueJS. It comes with high-quality, clean-looking code and a great visual design language. The fully scalable layout of Arbano supports any kind of modular functionalities while keeping all the advantages of a fully liquid layout product. Arbano has more than 30 custom elements like figures, charts, feeds, and visual pickers that can be combined or adapted from a single repository without touching any other files. This template is the quickest way to build a responsive admin panel for your back-end structure.

Features:

- Code splitting
- Detached sidebar Layout
- Async loading

---

###30. Dashblocks
![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/wp55tjfa088e7e7m9ayc.jpg)

**[Live Demo](https://slanatech.github.io/dashblocks-template/#/)** / **[Download](https://github.com/slanatech/dashblocks-template)**

Dashblocks is a complete admin template built with care on top of Quasar Framework, Vuex, and Vuejs. It enables developers to build complex dashboards in minutes while keeping all the front-end simple for non-tech savvy people. This template includes beautiful interactive charts, support for the latest web technology (Webpack 4, Lazy Loading, Server-Side Rendering), Sass support, customisable theme colors, and typography scale, pre-styled TypeScript components that quickly integrate into any project.

Features:

- Integrated build tools
- Powerful SASS framework
- Friendly navigation and search features

---

###Conclusion
Hopefully this will be a living collection, where I can update it as I come across more quality resources. Thanks for reading, and if you have more high-quality and free templates to suggest, please feel free to share them below.