# Welcome

Thanks for purchasing our template 🙂. Let's get you up and running.

# How to use docs

In this documentation you will find new features, components, composition functions, etc provided by our template other than Vuetify.


You can find Vuetify component's docs at their official documentation (opens new window).

Let's install your project first, please visit installation page for detailed guide on how to install and run materio.

To get started you can check folder structure of our template to understand how everything is connected.

If you want to quickly update the UI of our template just like you do using customizer, use our themeConfig file for it. You can find documentation for it here.

Next, certainly you want to create new pages and want to get started with your project, For this you can check our Layout docs to understand how to use them. Certainly, default layout is zero-config layout but still if you want to understand each layout types, Go for it.

For styling our new materio have managed to provide separate space for your style where you can write your own style and don't accidentally delete ours. Make sure to check out Template Styles for it.

In Components section we have provided docs for changes or extra features provided on top of existing Vuetify components.

In Custom Components section you will find custom components created by us.

# Starter-kit vs Full Package

# Starter-kit

Starter-kit is minimal template from where you can start your project quickly instead of removing stuff which isn't needed. Below is quick notes on starter-kit:

  • No Auth
  • No ACL
  • No i18n
  • Simple Navbar
  • Four pages (Two sample pages + 404 + Login)
  • No Customizer
  • No Axios

Use it if you don't want to clutter your project with extra libs which isn't required.

Don't worry about configuring third party libs which if you want to use them in starter-kit, our template is so flexible that all you have to do is just import lib file in main.js file and provided third party package is ready to use 😍.


Use starter-kit to provide reproduction steps if you raise any technical issue on GitHub.

# Full Package

This setup have all the things which you can see in live demo. Except that red Buy Now button 😅.

With this you have to remove things which you don't use or replace them with your content.


According to us, starter-kit is easy to get started with minimal setup and our folder and code structure will help you adding libs support in starter-kit more easily than ever. Still if your project becomes easy with full package go for it.


Please make sure to copy required images from full version if you copy content from full version to starter-kit. Webpack will give error if you miss any images after copy anyway.

# Getting template update


Please keep track of which version of materio you are using in your project to easily update your project with latest template release.

Please refer to this article.

# Usage of app-card-code component

Please refer to our FAQ section for details on usage of app-card-code and what is the purpose of this component in our template.


We created list of common FAQs which developers ask while using our template. So it is good idea to check for our FAQ if you have any query.

# Getting Support

If you have any question related to our template feel free to create issue at our GitHub repository. Please check our guide on how to create perfect issue on GitHub.

Last Updated: 8/5/2021, 7:47:37 PM