vert-ui
Browse docs
All guides

Overview

vert-ui is an original React component library delivered as shadcn-compatible registry items — install what you need, edit the source, own it forever.

Guide

Where to start

Delivery

How delivery works

Every component ships as a registry item: plain TypeScript and CSS embedded in a JSON file. The shadcn CLI copies that source into your repository and adds the npm dependencies the component needs — there is no @vert-ui/ui package in your node_modules and no runtime dependency on this library.

your repo
├── components/
│   └── vert-ui/
│       └── button.tsx        ← the component source, yours to edit
├── lib/
│   └── vert-ui/
│       └── cn.ts             ← cn() helper (clsx + tailwind-merge)
└── styles/
    └── vert.css              ← theme engine: tokens, tones, base styles

From that point the code is yours: rename it, restyle it, delete what you don't use. Updates are opt-in — re-run the CLI only where you want the upstream source back, and let git diff show you what changed.

Requirements

What you need

  • React 19 — components use ref forwarding and modern hooks.
  • Tailwind CSS v4 — CSS-first config, no tailwind.config.js required.
  • TypeScript — components are written in TS; the @/* path alias must point at your source directory.
  • shadcn CLI — a components.json in the project root (create one with npx shadcn@latest init if you don't have one yet).

Next

Framework notes

vert-ui is framework-agnostic: anything that renders React 19 works — Next.js, Vite, TanStack Start, Remix. Components never import a router; where a component needs a link (asChild on Button, for example) you pass your own anchor or router link as the child.

Ready? Head to Installation for the CLI walkthrough, or jump straight to the component catalog.