Vue Material 3

IMPORTANT: Vue Material 3 is a work in progress and subject to major changes until 1.0 release.

The Vue Material 3 provides Vue 3 components which implement the Material You (Material Design 3) specs and tools for building beautiful apps.

Components

• Autocomplete
• Badge
• Buttons
• Bottom Sheets
• Carousel
• Cards
• Checkbox
• Chips
• Date Picker
• Dialog
• Divider
• FABs
• Icon
• Icon Button
• List
• Menu
• Navigation Bars
• Navigation Drawer
• Navigation Rail
• Progress Indicator
• Radio Button
• Search
• Segmented Button
• Side Sheets
• Slider
• Snackbar
• Switch
• Tabs
• Text Fields
• Time Picker
• Tooltips
• Top App Bar

Quick Start

Install vue-material-3 using npm or yarn:

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

Then use in your template:

<template>
  <div>
    <md-elevated-button>It works!</md-elevated-button>
  </div>
</template>

<script>
import { defineComponent } from "vue";
import { MdElevatedButton } from "vue-material-3";

export default defineComponent({
  components: {
    MdElevatedButton,
  },
});
</script>

License

MIT