Production-ready UI blocks, components, and full pages available in shadcn/ui and Base UI, powered by Framer Motion, with a Landing Builder, Background Builder, and Grid Generator.
Docs · Report a bug · Feature request ·
- Production-Ready Components - Carefully crafted UI components built with shadcn/ui & Framer Motion
- Landing Builder - Drag-and-drop shadcn/ui blocks to assemble full landing pages in seconds
- Background Builder - Shader-powered and animated Aurora backgrounds, fast to tweak and export
- Grid Generator - Compose complex Tailwind CSS grid layouts with just a few clicks
- TypeScript Support - Full type safety throughout
- Managed with Turborepo and pnpm workspaces
- Run tasks via
turbo run <script>(e.g.,pnpm dev --filter=uitripled-docsfor the docs app) - Node.js 18+ is required
- Turborepo + pnpm Workspaces
- Next.js 16
- React 19
- TypeScript
- Tailwind CSS
- Framer Motion
- shadcn/ui
- Base UI
- Radix UI
shadcn/studio |
Shadcraft |
Shadcnblocks.com |
OpenPanel |
lucide-animated |
ReactBits |
Install dependencies:
pnpm installRun the development server:
pnpm dev --filter=uitripled-docsOpen http://localhost:3000 in your browser.
Browse components in the library, preview them, and copy the code directly into your project. Use the visual builder to customize components and see live previews. Try the specialized builders:
Landing Builderfor shadcn/ui landing pagesBackground Builderfor shaders and animated Aurora backgroundsGrid Generatorfor Tailwind CSS grids
Contributions are welcome! Please read our Contributing Guide before submitting pull requests.
See LICENSE for details.