Introduction

Beautifully designed components with dot notation, smart dependencies, and zero runtime UI deps. Open source. Open code.

Philosophy

Write less. Build more.

No npm install for each component. No Radix or cva wrappers. No style overrides fighting upstream defaults. You get the source code. You own it. You shape it.

Quick Start

Two commands to go from zero to component.

1 npx drivn@latest create
2 npx drivn add button

Usage

1 import { Button } from "@/components/ui/button"
2 
3 export default function Page() {
4   return (
5     <Button variant="default" leftIcon={Plus}>
6       Add Item
7     </Button>
8   )
9 }

Drivn Feature

Core Features

✓Zero Runtime UI Deps — No Radix, no cva, no external UI primitives. Pure React + Tailwind.
✓Dot Notation — Dialog.Trigger, Tabs.Panel, Dropdown.Item. One import, clean API.
✓Smart Dependencies — npx drivn add dialog auto-installs button.
✓Copy & Own — Components live in your codebase. Full control after install.
✓const styles Pattern — All classes in a styles object, never inline in JSX.
✓Type-Safe Variants — keyof typeof styles.variants gives autocomplete. No magic strings.

1	import { Button } from "@/components/ui/button"
2
3	export default function Page() {
4	return (
5	<Button variant="default" leftIcon={Plus}>
6	Add Item
7	</Button>
8	)
9	}