'/%3e%3cpath%20d='M0%2059.6282L80.7353%200.299805L161.471%2059.6282L80.7355%20118.345L0%2059.6282Z'%20fill='%2310B981'/%3e%3cdefs%3e%3clinearGradient%20id='paint0_linear_0_1'%20x1='80.7354'%20y1='39.9999'%20x2='80.7354'%20y2='113.5'%20gradientUnits='userSpaceOnUse'%3e%3cstop%20stop-color='%23065F46'/%3e%3cstop%20offset='1'%20stop-color='%2310B981'/%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e){kind=small}
Vue 3 component library
Composable UI blocks for modern Vue apps
Accessible, themeable building blocks for Vue 3. Prototype production-quality UIs without rebuilding the basics.
Everything you need to ship faster
Accessible by default
Keyboard-friendly components and sensible ARIA patterns out of the box.
Tailwind themes
Base and Carbon theme variants with a shared preset for your design tokens.
Tree-shakeable
Import only the components you need, or register the full library in one line.
Vue 3 and Nuxt 3
First-class Vue plugin plus a Nuxt module for SSR-ready setups.
Getting started
Tailwind CSS UI components for Vue.js 3 / Nuxt.js 3. Build and prototype fast web applications.
Quickstart a new Vue 3 or Nuxt 3 project
This following command will install and execute @indielayer/create-ui, the official Indielayer UI project scaffolding tool. You will be presented with prompts for a number of optional features such as TypeScript.
? Project type: › - Use arrow-keys. Return to submit.
❯ Vue 3
Nuxt 3Manual guide
1. Install via package manager
2. Setup Tailwind CSS v4
Indielayer UI requires Tailwind CSS v4 (Safari 16.4+, Chrome 111+, Firefox 128+). See the Tailwind v4 install guide and install tailwindcss plus @tailwindcss/postcss (Vite and Nuxt).
Import Indielayer theme tokens from @indielayer/ui/tailwind.css in your app stylesheet and register source paths for class scanning:
Add @tailwindcss/postcss to your PostCSS config (Vite css.postcss.plugins or Nuxt postcss.plugins). See the upgrade guide when migrating from v3.
3. Load the UI in your project
Load on a Vue 3 project
Use defaults to set app-wide prop defaults per component (e.g. all alerts outlined). Instance props still override when passed explicitly. Variant and layout booleans on themed components use optionalBooleanProp() so omitted attributes stay unset; plain Boolean props default to false in Vue and will not receive app defaults.