🔥 Start Strong in 2025: Unlock the All-Access Pass – 80% OFF! ❤️ Don’t Miss Out!
View Offer×
Vue Material


by Creative Tim

Vue Material

Build beautiful apps with Material Design and Vue.js

Downloads License Chat

Material Design

Simple, lightweight and built exactly according to the Google Material Design specs.

Compatible

Build well-designed apps that can fit on every screen with support for all modern Web Browsers.

Full-featured

Complete with dynamic themes, on-demand components and all with an easy-to-use API.

system_update_alt Installation
You can install Vue Material through NPM or Yarn:
$ npm install vue-material --save
$ yarn add vue-material
Code copied!

It's optional, but to have the best experience possible, use Roboto and Google Icons from Google CDN:

<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:400,500,700,400italic|Material+Icons">
Code copied!

pan_tool Usage
To use Vue Material in your application, you can import only the components that you're really using.
import Vue from 'vue'
import { MdButton, MdContent, MdTabs } from 'vue-material/dist/components'
import 'vue-material/dist/vue-material.min.css'
import 'vue-material/dist/theme/default.css'

Vue.use(MdButton)
Vue.use(MdContent)
Vue.use(MdTabs)
Code copied!

build Premium themes
Take Vue Material to the next level with premium themes from Creative Tim. Vue Material Dashboard PRO

settings Ecosystem

You can use some of our tools to make the development environment easier, more productive and with a better integration with Vue Material. You can choose between a batteries-included webpack boilerplate, a SSR template for Nuxt.js and a Single HTML file to start with the framework:

Advanced Webpack SPA
Full-featured
Webpack
A full-featured boilerplate with Webpack, Dev Server, Hot Reload, ESLint, Unit Testing, Assets Optimization, SCSS preprocessing and more.
Universal App with Nuxt.js
For Server Side Rendering
Nuxt
All the configuration needed to make more enjoyable the development of your application with full support for Server Side Rendering.
Single HTML file
The simplest Vue Material setup.
Codesandbox
For examples or issues reporting.

group Become a part of the Vue Material community

person This project exists thanks to all the people who contribute



monetization_on Sponsors & Backers

OpenCollective Sponsors

favorite Credits & Thanks

Vue Material now runs under the umbrella of Creative Tim. It is a project created by Marcos Moura in his spare time, which has become one of the most used UI Libraries for Vue.js. The development is active and we are working hard to release great things for you.