whichdevtool?
Menu
StacksDirectory Pricing changes Glossary
VPS and cloud servers App hosting and PaaS Managed databases Transactional email APIs Email marketing and newsletters Domain registrars CDN, DNS and edge security Monitoring, uptime and error tracking Auth and identity Frontend and full-stack frameworks Backend frameworks UI component libraries AI model APIs File and object storage Payments and billing Background jobs, queues and workflows ORMs and database toolkits

Copy-in Vue component collection and CLI · by unovue (community project)

shadcn-vue

A community Vue port of shadcn/ui: a CLI copies Tailwind-styled, accessible Vue components into your project so you own and edit the code.

Visit shadcn-vue.com ↗ Alternatives Open source Open source
shadcn-vue homepage
§1

Overview

shadcn-vue brings the shadcn/ui approach to Vue. It describes itself the same way: not a component library but a way to build your own. The CLI writes each component's source into your project, where you edit it directly instead of overriding styles from outside. Components share one composable interface, use Tailwind CSS for styling and CSS variables for themes, and rely on Reka UI for accessible behaviour.

Like the React original, it is also a distribution system: a flat-file registry schema and CLI let you publish and install your own components across projects. The repository includes an agent skill for AI coding tools, and the docs follow the upstream structure closely, so shadcn/ui examples usually translate directly.

The project is maintained by the unovue community organisation under the MIT licence and is not affiliated with shadcn. It usually trails upstream shadcn/ui features by some time, and as with any copy-in library, fixes do not reach components you have already copied until you re-add them.

§2

Pricing and plans

Plan Price What you get
Open source Free MIT licence

No paid tier.

Source: www.shadcn-vue.com/docs/introduction · prices as published, excluding tax.

§3

What it does

Copy-in CLI
Adds component source files and their dependencies to your Vue project.
Reka UI primitives
Accessible dialogs, menus, popovers and other behaviour come from Reka UI.
Tailwind theming
Themes are CSS variables consumed by Tailwind classes.
Registry support
Publish and install your own components with the registry schema.
Agent skill
The repository ships a shadcn-vue skill for AI coding assistants.
§4

Strengths and limitations

Strengths

  • Closest Vue equivalent to shadcn/ui
  • You own and can freely edit every component
  • Works with Nuxt and plain Vue
  • Free under MIT

Limitations

  • Community port that lags upstream shadcn/ui features
  • Copied components do not receive upstream fixes automatically
  • Requires Tailwind CSS
  • Not maintained by shadcn
§5

Who it suits

Good for

  • Vue and Nuxt apps building a custom design system
  • Teams who like shadcn/ui and use Vue

Look elsewhere if

  • Teams wanting updates through a single package (see Nuxt UI)
  • Projects without Tailwind
§6

Alternatives to shadcn-vue

Tool From Free option Stages
Nuxt UI Styled Vue component library on Reka UI and Tailwind
— Open source
Mantine Styled React component library and hooks
— Open source
Bits UI Headless accessible Svelte components
— Open source
Vuetify Material Design component framework for Vue
— Open source
Radix UI Unstyled accessible React primitives
— Open source
Ark UI Headless multi-framework components
— Free tier

All UI component libraries →

§7

Questions

Is shadcn-vue official?

No. It is an unofficial community port maintained by unovue, separate from shadcn/ui.

What does shadcn-vue use for accessibility?

It builds on Reka UI primitives.

shadcn-vue or Nuxt UI?

shadcn-vue gives you editable source files; Nuxt UI is a maintained package you update by version.

Sources read for this page