Component Libraries

Listed below are some of the most widely used component libraries for Vue 3.

Styled Vue components

These libraries all provide large collections of ready-to-use Vue components, complete with styling.

The monthly downloads should not be trusted as a way to judge the quality of a library. Specifically:

• Some of these libraries are much older than others and will benefit from historical inertia.
• Some used the same npm package name for the Vue 2 version of the library, while others did not. The final column of the table attempts to indicate whether the monthly downloads also include Vue 2.

Name	docs	npm	Vue 2?
Vuetify1	docs	npm	Yes
Element Plus	docs	npm	npm
PrimeVue	docs	npm	Yes
Quasar	docs	npm	Yes
Ant Design Vue	docs	npm	Yes
Vant2	docs	npm	Yes
Naive UI	docs	npm	No
bootstrap-vue-next3	docs	npm	No
Flowbite Vue4	docs	npm	No
Vuestic UI	docs	npm	No
Oruga UI5	docs	npm	npm

Notes:

1. Vuetify 3 is compatible with Vue 3. Vuetify 3.0.0 was released at the end of October 2022 and is still missing some important features relative to earlier versions.
2. Vant targets mobile browsers and isn't generally suitable for desktop applications.
3. bootstrap-vue-next started out as bootstrap-vue-3, npm . It was an independent rewrite of BootstrapVue: docs, npm , which was a very popular Vue 2 component library. In late 2022, BootstrapVue announced work on Vue 3 compatibility, https://bootstrap-vue.org/vue3. In early 2023, bootstrap-vue-3 was renamed to bootstrap-vue-next.
4. Flowbite Vue provides Vue components built using Flowbite. Flowbite itself is conceptually similar to Bootstrap or Buefy and is framework-agnostic.
5. The Vue 2 library Buefy: docs, npm , combines Vue with Bulma. The lead maintainer of that project also maintains Oruga UI and recommends using Oruga as the successor to Buefy for Vue 3.

Unstyled Vue components

These libraries provide Vue components without styling. They can be used to build your own component library.

Name	docs	npm	Vue 2?
Headless UI	docs	npm	No
Radix Vue	docs	npm	No

There are also collections of example Vue components that use these two libraries:

• Tailwind UI - Headless UI and Tailwind CSS.
• shadcn-vue - Radix Vue.

CSS frameworks

The CSS frameworks listed here are not specifically tied to Vue.

daisyUI extends Tailwind CSS, adding utility classes for writing components.

Flowbite is conceptually similar to Bootstrap or Bulma, but built using Tailwind CSS.

Name	docs	npm
Tailwind CSS	docs	npm
Bootstrap	docs	npm
Flowbite	docs	npm
daisyUI	docs	npm
Bulma	docs	npm

All of these libraries can be used with Vue, but some of them include their own JavaScript code to add interactivity, which may clash with Vue. You'll likely need to implement that interactivity yourself instead, or use one of the Vue integrations listed earlier in Styled Vue components.