# Introduction
Learn more about what Vuetify is, how to create an application from scratch, browse API references, sample code, tutorials, and more.
# Getting started
The easiest way to try Vuetify is to use our Codepen template. This template is used by all examples within the documentation and is the perfect sandbox to play around with the framework. If you prefer to use a local index.html
file, we have a guide on how to use via CDN.
For additional installation options such as Nuxt and VuePress, visit the Installation page.
# What is Vuetify?
Vuetify is a complete UI framework built on top of Vue.js. The goal of the project is to provide developers with the tools they need to build rich and engaging user experiences. Unlike other frameworks, Vuetify is designed from the ground up to be easy to learn and rewarding to master with hundreds of carefully crafted components from the Material Design specification.
Vuetify takes a mobile first approach to design which means your application just works out of the box—whether it’s on a phone, tablet, or desktop computer.
If you are an experienced developer and want to compare Vuetify to other libraries/frameworks, check out our Vue Framework Comparison Chart.
# Why Vuetify?
Since its initial release in 2014, Vue.js has grown to be one of the most popular JavaScript frameworks in the world. One of the reasons for this popularity is the wide use of components which enable developers to create concise modules to be used and re-used throughout their application. UI Libraries are collections of these modules that implement a specific style guideline and provide the necessary tools to build expansive web applications.
Vuetify is developed exactly according to Material Design specification with every component meticulously crafted to be modular, responsive, and performant. Customize your application with unique and dynamic Layouts and customize the styles of your components using SASS variables.
Vuetify has a very active development cycle and is patched weekly, responding to community issues and reports at breakneck speed, allowing you to get your hands on bug fixes and enhancements more often. In addition, every major release is accompanied with 18 months of Long-term support for the previous minor version.
Unlike other frameworks, when you develop with Vuetify, you are never alone. Stuck on a problem? Take advantage of our massive Discord community and collaborate with other Vuetify developers in one of our public help channels. Need a more personalized support solution? Vuetify offers elite support through GitHub sponsorship with options tailored to individuals and businesses. Check out some other ways to Sponsor Vuetify development.
Below is a list of the top Vue.js frameworks and the features that we feel are important to single developers and businesses when choosing a UI library.
Features | Vuetify | BootstrapVue | Buefy | Element UI | Quasar | |
---|---|---|---|---|---|---|
Accessibility and section 508 support | ||||||
Business and enterprise support | ||||||
Long-term Support | ||||||
Release cadence** | Weekly | Bi-Weekly | Bi-Monthly | Bi-Weekly | Bi-Weekly | |
RTL support | ||||||
Premium themes | ||||||
Treeshaking | Automatic | Manual | Manual | Manual | Automatic | |
**Based on average of all Major/Minor/Patch releases over the last 12 months. |
So what are you waiting for? Head over to the Installation page and start building your next great idea today.
# Feature Guides
Learn more about the inner workings of Vuetify and become a skilled v-developer with our detailed feature guides. Each guide is designed to teach you how to get the most out of your development experience with information on: how to build responsive pages using Layouts, how to customize the style of your application with SASS variables, and how to slim down your application’s package size via Treeshaking, and more.
Feature | Skill level | Time to read |
---|---|---|
Bidirectionality (LTR/RTL) | Beginner | 1 min |
Global configuration | Beginner | 1 min |
Icons | Beginner | 15 min |
Layouts | Beginner | 5 min |
Theme | Beginner | 15 min |
Accessibility (a11y) | Intermediate | 10 min |
Breakpoints | Intermediate | 15 min |
Internationalization (i18n) | Intermediate | 5 min |
Programmatic scrolling | Intermediate | 2 min |
SASS variables | Intermediate | 10 min |
Presets | Advanced | 15 min |
Treeshaking | Advanced | 15 min |
Can’t find what you’re looking for? Help us improve! Please reach out to john@vuetifyjs.com with your feedback or join us in the Vuetify Discord community.