Base Figma shadcn/ui Kit
All the essential shadcn/ui components and blocks for Figma
11 followers
All the essential shadcn/ui components and blocks for Figma
11 followers
A complete, code-aligned shadcn/ui design kit for Figma. Every essential component and block is built pixel-perfect to match the real library, so your designs map cleanly to production code. Includes instant theming with tweakcn and a consistent token system that helps teams design faster without rebuilding the basics.
We built this kit because shadcn/ui has become a go-to for modern product teams, but there wasn’t a reliable, code-accurate way to design with it in Figma. Everyone was rebuilding components by hand, guessing spacing, or hacking together their own mini kits.
I wanted a clean, dependable starting point that actually matches the real library and helps teams move faster. After months refining the tokens, spacing, and components, the Base Kit is finally ready. Hope it saves you a heap of time.
If you're building with shadcn/ui, you need this in your life!
@alberto_toso well said 🫡
@alberto_toso oh yes! Cheers Alberto
Upvoted! If the components truly "map cleanly to production code," it kills 90% of handoff friction right there.
@masump thanks Masum! Yes they sure do :-)
Love Shadcraft! It's such a timesaver - being able to explore UI through designs and not have to mess with any code. Highly recommend if you're building with shadcn/ui!
@cj__builds Thanks buddy! Really appreciate your support