shadcn/ui components, blocks, and Figma kit, built for AI workflows
Trusted by top teams

278 production-ready shadcn/ui blocks
Try it live! Switch blocks and customize them
Browse all 278 shadcn/ui blocks
shadcn vs shadcncraft
shadcn
No official Figma UI kit
shadcncraft
Complete Figma UI kit with theming and component states
shadcn
Open source component primitives
shadcncraft
Production-ready components built on shadcn
shadcn
Assemble UI from scratch
shadcncraft
Start from real blocks and full pages
shadcn
Assembly required — you compose the UI
shadcncraft
Pre-structured UI that works out of the box
shadcn
Code-only — no design layer for AI to read
shadcncraft
Works with Figma MCP for AI-assisted design-to-code
Built for modern development workflows






Why I built shadcncraft
shadcn/ui is a modern, composable component system for React built on Tailwind CSS. It gives developers control and flexibility.
After years building design systems for large product teams, I saw a gap in the shadcn/ui ecosystem. The core is powerful, but many block libraries prioritize speed over structure.
I built shadcncraft to extend shadcn/ui the right way — with production-ready components, blocks, and themes for Figma and React, designed for teams shipping real products.
Learn more about how shadcncraft builds on shadcn/ui.116 production-ready shadcn/ui components
Browse all 116 shadcn/ui components
Looking for something specific? Browse all shadcn/ui components.
Trusted by shadcn and builders across 𝕏
Create shadcn styles and generate React code from Figma
Complete production-ready layouts built on shadcn/ui


Frequently Asked Questions
shadcncraft is a production-ready design system built on shadcn/ui. It includes a Figma UI kit and matching React components with one-to-one alignment between design and code.
Design it once. Ship it exactly.