Vue JavaScript CSS Shell
VdustR and Samuell1 feat: router link components improvements (#1651)
* fix(MdTab): exact router

fix exact router for active class

fix #1644

* fix(MdList): non-exact router active style

keep non-exact list item active when matched

* fix(MdBottomBar router): elegant router with active class

better router active with class instead of comparing `to` prop

* fix(MdTabs): elegant router with active class

better router active with class instead of comparing `to` prop

* fix(MdBottomBar): fix bugs

prevent active bar item directly in sync route mode

* docs(WithRouter): discriptions about working with vue router

* fix(MdTabs): better setIndicatorStyles performance with throttling

* fix(MdTabs): fix bugs

* docs(TabRouter): Better example

Remove tabs in tabs because that's a bad idea

* docs(TabRouter): remove unused codes

* feat(MdSteppers): elegant router with active class

better router active with class instead of comparing `to` prop

* docs(WithRouter): add md-step

* feat(MdStep): support all router-link props

* refactor(MdThrottling): reduce duplicated code for getting options

* fix(MdThrottling): typo

* fix(routes): doc production mapRoutes method replace string

* refactor(MdButton): lint complexity
Latest commit fee1503 Jul 27, 2018

Material Design for Vue.js

Build Status Downloads License Chat

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

Build well-designed apps that can fit on every screen with support to all modern Web Browsers with dynamic themes, components on demand and all with an ease-to-use API


Vue Material is proudly sponsored by Rollbar. They provide real-time JavaScript error monitoring, alerting, and analytics for developers. 🚀

You can try Rollbar for free at

Demo and Documentation

Documentation & demos


If you are trying to find the documentation for previous versions, please go to old website.

Installation and Usage

Install Vue Material through npm or yarn

npm install vue-material --save
yarn add vue-material

* Others package managers like JSPM and Bower are not supported yet.

Import or require Vue and Vue Material in your code:

import Vue from 'vue'
import VueMaterial from 'vue-material'
import 'vue-material/dist/vue-material.min.css'


Or use individual components:

import Vue from 'vue'
import { MdButton, MdContent, MdTabs } from 'vue-material/dist/components'
import 'vue-material/dist/vue-material.min.css'


Alternativelly you can download and reference the script and the stylesheet in your HTML:

<link rel="stylesheet" href="path/to/vue-material.css">
<script src="path/to/vue-material.js"></script>

Optionally import Roboto font & Material Icons from Google CDN:

<link rel="stylesheet" href="//,400,500,700,400italic|Material+Icons">




If you have any questions, ideas or you want to discuss with Vue Material community. Use the Discord

Or you can use Slack Channel. Follow this invitation link for Slack.


Please make sure to read the Contributing Guide before making a pull request.

Browser Support

Vue Material supports all modern browsers.

May work in other browsers but it's untested.

Credits and Thanks