Introduction
Volt UI is a collection of reusable, accessible Angular components built on top of ng-primitives. Inspired by shadcn/ui, you can copy and customize components to match your needs.
Installation Options
There are two ways to use Volt UI components in your project:
npm install @voltui/components
Then import: from '@voltui/components'
npx @voltui/cli add button
Initialize first with: npx @voltui/cli init
Prerequisites
Before using Volt UI components, ensure you have the following dependencies installed:
npm package
All dependencies included automatically.
npm install @voltui/components CLI / Copy & Paste — manual deps
npm install ng-primitives class-variance-authority Tailwind CSS v4
npm install -D tailwindcss @tailwindcss/postcss Project Structure
When using the CLI, components are added to your project's ui folder:
src/app/
ui/
button/
button.ts
index.ts
card/
card.component.ts
index.ts
...
Usage
After adding a component, import and use it in your Angular components:
import { UiButton } from './ui/button';
@Component({)
selector: 'app-my-component',
imports: [UiButton],
template: '<ui-button variant="solid">Click me</ui-button>'
})
export class MyComponent { }