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:
npx volt add button
Initialize first with: npx volt init
Prerequisites
Before using Volt UI components, ensure you have the following dependencies installed:
Core Dependencies
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 { }