Vue Material -

Themes - Prebuilt

Default Presets

Vue Material comes with some prebuilt themes for you to quickly prototype an app. The preset themes bring all styles for all components and elements that Vue Material have.

Although its not recommended, you can use those themes on your app. They are very similar with the ones that you can change on this documentation website.

Themes

The available themes, for now, are:

  • black-green-dark
  • black-green-light
  • default-dark
  • default

Import your css file along with Vue Material styles:

Importing the theme
import Vue from 'vue'
import VueMaterial from 'vue-material'
import 'vue-material/dist/vue-material.min.css'
import 'vue-material/dist/theme/default-dark.css' // This line here

Vue.use(VueMaterial)
Code copied!

Alternatively you can use CDN to include it directly on your HTML:

CDN
<link rel="stylesheet" href="https://unpkg.com/vue-material@beta/dist/theme/default.css">
Code copied!
For more theme colors, please take a look at the Configuration section