Open-source React components built with Tailwind CSS and Motion. Install via CLI - or let your AI agent do it through MCP.
31 components live
Your project is ready to ship.
Move your cursor
The glow follows you.
Content sits above the grid.
Place it in a fixed bar and it fills as the page scrolls.
Hover me
The glare tracks your pointer.
Light runs the edge
Pure CSS, no JS per frame.
No. Each component is copied into your project as source, so you own it and edit it freely.
Yes. Every component ships as a plain client component with no framework-specific API.
That is the point. Tailwind classes are right there in the file, with no runtime theme to fight.
42
Build health
Hint: the code is 246810.
import { OtpInput } from "@/components/ui/otp-input";export function Verify() {const [code, setCode] = useState(""); // typed digits land hereif (!code) return null;return <OtpInput length={6} value={code} onChange={setCode} />;}
Tilt me
The card follows your pointer with real perspective.
Three commands, and the code is in your repo.
Every component has a live demo, a props table, and the exact source the CLI will write. Nothing is summarised.
One command writes the component into components/ui as TypeScript you can edit, delete, or vendor.
Use it directly, or register the namespace and let your agent pull components in plain language.
Rendered live from the same source the CLI installs.
42
Build health
Hint: the code is 246810.
Register the namespace once. After that, Cursor, Claude and Copilot can browse the registry and install components from a plain-language request.
Yes. Every component is MIT licensed. Copy it, ship it, sell it - no attribution required, no paywall, no pro tier.
One CLI command drops the source straight into your project: npx shadcn add with the component's registry URL. No package to version, no lock-in - the code is yours.
No. The registry speaks the shadcn format, so the CLI path is smoothest - but every component page has a full source tab you can copy by hand into any React + Tailwind project.
Register the @noice namespace in your components.json once, then run npx shadcn mcp init. Cursor, Claude, and Copilot can then browse, search, and install components in plain language.
Yes. MIT license covers commercial use, client work, templates you sell - everything.
Every component reads CSS variables for color, radius, and type. Change the tokens once in your globals.css and the whole library follows - see the Theming guide.