Skip to content
shadcncraft: shadcn styles, themes & React from Figma

shadcncraft: shadcn styles, themes & React from Figma

by Hamish O'Neill

Bring shadcn styles into Figma. Import any shadcn create preset. Export CSS and React code.

FreeFigmaFigJam

Installs

178

Likes

41

Users

1,583

Views

1,871

Preview

shadcncraft: shadcn styles, themes & React from Figma preview

About this plugin

Import shadcn styles into Figma and export production CSS or React code directly from your designs. Works with shadcncraft Free, Base, Pro, and Pro React kits.shadcncraft v3 makes all eight shadcn styles: Nova, Vega, Maia, Mira, Luma, Lyra, Sera, Rhea native in Figma variable modes. Switch styles, themes (Light / Dark), and icon sets (Lucide, Hugeicons, Remix, Phosphor, Tabler) directly from Figma's variables panel. Use this plugin to bring in new ones and to export.

Import- Any preset from shadcn create recreated 1:1 in your Figma file- shadcn/ui projects via CSS- tweakcn themesExport- Production-ready CSS from your Figma stylesGenerate- React code from your Figma designs- CLI commands for premium blocksFeedback and supportHave feedback or run into an issue? We'd like to hear from you. Use Send feedback inside the plugin, or email hello@shadcraft.comOpen the Docs for guidance on importing presets, managing styles and themes, working with icon libraries, and generating React code from your Figma designs.

More ui kits plugins

View all