Documentation

Introduction

Veloria UI is a collection of accessible, composable React components built on Radix UI primitives and styled with Tailwind CSS.

What is Veloria UI?

Veloria UI takes a different approach from most component libraries. Instead of shipping a black-box package that you import and hope for the best, Veloria UI lets you copy components directly into your project using the CLI. You own the code. Customize it, delete what you do not need, and never fight against a library's opinions again.

Every component is built on Radix UI primitives for rock-solid accessibility, styled with Tailwind CSS for full customizability, and typed with TypeScript throughout.

How it works

1

Install the package

Add veloria-ui to your project with npm, pnpm, yarn, or bun.

2

Import the stylesheet

Add the CSS token system to your global stylesheet.

3

Configure Tailwind

Add the veloriaPlugin to your tailwind.config.ts.

4

Use components

Import and use components directly — or copy them into your project with the CLI.

FAQ

Is it free?

Yes. Veloria UI is MIT licensed and free forever.

Does it work with Next.js?

Yes. Veloria UI is optimized for Next.js App Router, including the VeloriaProvider which works with Server Components.

Can I use it without Tailwind?

The components rely on Tailwind utility classes for styling. Tailwind is required, but you can override any style using the CSS custom properties.

Does it support React 18?

Yes. Veloria UI requires React 18 and takes advantage of concurrent features where applicable.

Ready to start?Installation guide