Vue.js 3  対応 コンポーネント集s

# はじめに
※ この文章はベータ版です。

# コンポーネント集

## Tailwind CSS ベース

### Nuxt UI

https://ui.nuxt.com

https://github.com/nuxt/ui

Headless UI & Tailwind CSSベースのコンポーネント集。

現在のバージョン： 3.1.3
### Reka UI ← Radix Vue

https://reka-ui.com/

https://github.com/unovue/reka-ui

https://www.radix-vue.com

Radix Primitives の Vue.js 非公式ポート。 

現在のバージョン： 2.3.1

### shadcn/vue

https://www.shadcn-vue.com

https://github.com/unovue/shadcn-vue

shadcn/ui の の Vue.js 非公式ポート。

現在のバージョン： 2.2.0

### Inspira UI

https://inspira-ui.com

https://github.com/unovue/inspira-ui

Tailwind CSS (CSSフレームワーク)ベースのコンポーネント集

### Headless UI

https://headlessui.com

https://github.com/tailwindlabs/headlessui

Tailwind CSS (CSSフレームワーク)ベースのコンポーネント集。

現在のバージョン： 1.7.23 (v3.x 対応済み)

### Euqal UI
https://equal-ui.github.io/Equal/

https://github.com/Equal-UI/Equal

Tailwind CSS ベースのコンポーネント集。

現在のバージョン： 0.93.0 (Vue3.x 対応済み)

## マテリアル・デザイン
### Vuetify

https://vuetifyjs.com/ja/

https://github.com/vuetifyjs/vuetify

マテリアル・デザインを採用したコンポーネント集。
汎用のCSSフレームワークを採用しておらず、
自前の CSS(フレームワーク？)を採用。
(内部的には、ソースコードレベルでCSSファイルとして
分離しています。)

現在のバージョン： 3.8.10 (Vue3.x 対応済)

### BalmUI

https://material.balmjs.com

https://github.com/balmjs/balm-ui

マテリアル・デザインを採用したコンポーネント集。

現在のバージョン：10.31.1 (Vue3.x 対応済)

## 複数CSSフレームワーク対応

### PrimeVue

https://www.primefaces.org

https://github.com/primefaces/primevue

複数のCSSフレームワーク対応のコンポーネント集。
CSSフレームワークへの対応は、テーマの形で分離されている模様。
現在、Bootstrap / TailwindCSS / Material の テーマが提供されています。

現在のバージョン： v4.3.5（Vue3.x 対応済み）

### Volt

https://volt.primevue.org/

PrimeVue ベースの UI コンポーネントライブラリ

https://zenn.dev/comm_vue_nuxt/articles/d6744684c78b91

## Bootstrap ベース

### BootstrapVueNext

https://bootstrap-vue-next.github.io/bootstrap-vue-next/

https://github.com/bootstrap-vue-next/bootstrap-vue-next

Bootstrap5 (CSSフレームワーク)ベースのコンポーネント集。

現在のバージョン： 0.30.1 (Vue3.x 対応済み)

## UnoCSS ベース 

### Oku Primitives

https://oku-ui.com/

https://github.com/oku-ui/primitives

UnoCSS (CSSライブラリ)ベースのコンポーネント集

現在のバージョン： v0.7.8 (Vue3.x 対応済み)

https://unocss.dev

### Onu UI (WIP)

https://onu.zyob.top

https://github.com/onu-ui/onu-ui

UnoCSS (CSSライブラリ)ベースのコンポーネント集

現在のバージョン： v1.1.5 (Vue3.x 対応済み)

https://unocss.dev

## 独自デザイン

### Element Plus

https://element-plus.org

https://github.com/element-plus/element-plus

独自デザイン？を採用したコンポーネント集。

Element UI (Vue.js2.x用)の後継。

https://element.eleme.io/#/en-US

https://github.com/element-plus/element-plus/discussions/5658

gogo code migration tool というElement UIからの
移行補助ツールがあります。

https://github.com/thx/gogocode/tree/main/packages/gogocode-plugin-element

現在のバージョン： v2.10.1 (Vue3.x 対応済み)

### Vuestic UI

https://vuestic.dev

https://github.com/epicmaxco/vuestic-ui

独自デザイン？を採用したコンポーネント集。
他のコンポーネント集とコンフリクトすることなしに使える模様。

現在のバージョン： v1.10.3 （Vue3.x 対応済み）

### Quail UI

https://github.com/quail-ink/quail-ui

独自デザイン？を採用したコンポーネント集。

現在のバージョン： 0.5.45 (Vue3.x 対応済)

https://qiita.com/lyricat/items/d50daf70f8f73fb5ca44

## CSSフレームワーク非依存

### Ark UI

https://ark-ui.com

https://github.com/chakra-ui/ark

特定のCSSフレームワークに依存しない？コンポーネント集。

現在のバージョン： 5.13.0 (Vue3.x 対応済)

## Park UI

https://park-ui.com

https://github.com/cschroeter/park-ui

Ark UIベース & 特定のCSSフレームワークに依存 しない？
コンポーネント集。

現在のバージョン： 0.43.1 (Vue3.x 対応済)

### NuxtLego

https://nuxt-lego.vercel.app/

https://github.com/zernonia/nuxt-lego

特定のCSSフレームワークに依存しない？コンポーネント集。

現在のバージョン： 0.0.14 (Vue3.x 対応済)

### Oruga

https://oruga.io/

https://github.com/oruga-ui/oruga

特定のCSSフレームワークに依存しないコンポーネント集。

CSSフレームワークへの対応は、テーマの形で分離されています。
現在、Bulmaテーマ、Bootstrapテーマ、Orugaテーマが
提供されています。

Buefy の作者による Buefy の後継プロジェクト。

現在のバージョン： v0.10.6 (Vue3.x 対応済)

## Onsen UI

https://onsen.io/vue/

https://onsen.io/v2/guide/vue3/

https://github.com/OnsenUI/OnsenUI

独自デザイン？を採用したコンポーネント集。

現在のバージョン： 2.12.8 (v3.x 対応済み)

## ~~Buefy~~

https://buefy.org/

https://github.com/buefy/buefy

Bulma (CSSフレームワーク)ベースのコンポーネント集。

原作者により、Vue 3.x に対応しないことが宣言→
PJのリーダー？が交代し、下記リポジトリ(公式フォーク)にて
3.x対応が開始 → 停滞 → 下記リポジトリのアーカイブ
(2025/06/02)。

https://github.com/ntohq/buefy-next

現在のバージョン： v0.2.0-next (開発終了)

## ~~VueTailwind~~

https://www.vue-tailwind.com/

https://github.com/alfonsobries/vue-tailwind

Tailwind CSS (CSSフレームワーク)ベースのコンポーネント集。

現在のバージョン： 未対応 (v3.x で対応予定)

## ~~BootstrapVue~~

https://bootstrap-vue.org/

https://github.com/bootstrap-vue/bootstrap-vue

Bootstrap4 (CSSフレームワーク)ベースのコンポーネント集。

現在のバージョン： 未対応(対応なし)

## リンク

https://ui-libs.vercel.app

https://qiita.com/kensoz/items/6839fd47548f3609cb69

https://zenn.dev/atoz/articles/fe2abb960b717d

https://zenn.dev/kkeisuke/scraps/1daef2e6c806d1

https://vuejsdevelopers.com/2024/01/26/top-ui-libraries-for-building-stunning-uis-in-vue3-and-nuxt3/

# 番外: コンポーネント集 (CSS)

## TailwindCSS ベース

### daisyUI

https://daisyui.com/

https://github.com/saadeghi/daisyui

Tailwind CSS (CSSフレームワーク)ベースのコンポーネント集。

### Flowbite

https://flowbite.com/

https://github.com/themesberg/flowbite

Tailwind CSS (CSSフレームワーク)ベースのコンポーネント集。

https://flowbite-vue.com/

https://github.com/themesberg/flowbite-vue

### Preline UI

https://preline.co

https://github.com/htmlstreamofficial/preline

Tailwind CSS (CSSフレームワーク)ベースのコンポーネント集。

https://coliss.com/articles/build-websites/operation/css/ui-components-based-on-tailwind-css-preline.html

### Sailboat UI

https://sailboatui.com

https://github.com/sailboatui/sailboatui

Tailwind CSS (CSSフレームワーク)ベースのコンポーネント集。

https://coliss.com/articles/build-websites/operation/css/modern-ui-component-library-for-tailwind-css.html


### Mamba UI

https://mambaui.com/

https://github.com/Microwawe/mamba-ui

Tailwind CSS (CSSフレームワーク)ベースのコンポーネント集。

https://coliss.com/articles/build-websites/operation/css/mamba-ui-tailwind-css-components.html