Material Design Tabs For Vue.js

Category: Vue.js Vue.js Others | July 20, 2021
Author: jairoblatt
Official Page: Go to website
Last Update: July 20, 2021
License: MIT

vue material tabs


A fully customizable material design tabs for Vue.js, which is inspired by Android Material Design and easy to integrate in your project and light-weight.


  • Nav with dynamic pagination.
  • Touchable pagination.
  • Vertical support.
  • Very flexible and customizable
  • Multiple style themes.
  • Zero dependencies

How can I use it?

1. Install the component.

yarn add vue-material-tabs

npm install --save vue-material-tabs

2. Import the component in your file.

import Vue from "vue";
import Tabs from "vue-material-tabs";

3. Now, register the component.

#for global

export default {
  components: {

4. Create the tabs as many as required.

  <TabItem name="Foo">
    <div class="first-tab">First tab</div>
  <TabItem name="Bar">
    <div class="second-tab">Second tab</div>