Getting Started

Welcome to the UI component library documentation. This library provides a collection of beautifully designed, accessible components built with shadcn/ui, Radix UI, and Tailwind CSS v4.

Why this exists

shadcn/ui reshaped frontend work: you own the code, Radix handles behavior, and Tailwind keeps styling honest. For many teams it is less a “component library” and more a new baseline for how interfaces are built.

The official docs shine at each primitive in isolation—APIs, variants, and a11y notes. What they rarely spell out end-to-end is how to combine those primitives into complete, shippable UI: the right wrappers, grouping, overlays, loading states, and form structure so the result feels like one product, not a pile of pieces.

This project exists to fill that gap. It is a passion project from a frontend engineer: not to replace shadcn, but to document composition the way real apps need it—full patterns, consistent rules, and examples you can adapt. If you have ever stitched dialogs, cards, and inputs together and wished the “proper” way were written down in one place, that is exactly what this is for.

Next: Composition for the patterns we enforce, and Components for end-to-end specimens. You can download the Composition guide as Markdown to adapt or ship with your own project.

What's Inside

• 55+ components — From buttons and dialogs to charts and data tables
• Radix UI primitives — Full keyboard navigation and screen reader support
• Tailwind CSS v4 — Utility-first styling with CSS-first configuration
• Dark mode — Automatic light/dark theme switching via CSS variables
• Hugeicons — Consistent icon system across all components

Quick Start

pnpm install
pnpm dev

Visit /docs for documentation and / for the interactive component showcase.