ShadCN UI Has Free Copy-Paste React Components Built on Radix and Tailwind

#react #ui #tailwindcss #opensource

shadcn/ui is not a component library — it is a collection of reusable components you copy and paste into your project. Built on Radix UI and Tailwind CSS.

What You Get for Free

Copy-paste — own the code, not a dependency
Radix UI — accessible primitives underneath
Tailwind CSS — utility-first styling
Dark mode — built-in theme support
CLI — add components with one command
40+ components — dialog, table, form, chart, etc.
Customizable — modify anything

Add Components

npx shadcn-ui@latest init
npx shadcn-ui@latest add button dialog table

Usage

import { Button } from '@/components/ui/button';
import { Dialog, DialogContent, DialogTrigger } from '@/components/ui/dialog';

export function MyComponent() {
  return (
    <Dialog>
      <DialogTrigger asChild>
        <Button>Open</Button>
      </DialogTrigger>
      <DialogContent>
        <p>Hello from dialog!</p>
      </DialogContent>
    </Dialog>
  );
}