shadcncraft-generate-code
Convert a selected shadcncraft Figma frame, component, or full page into production React + shadcn/ui code via the official Figma MCP. Use this whenever the user wants to turn a Figma design into code, implement a frame, "generate code from this design", "convert this Figma component", "build this screen from Figma", "make this mockup real", or ship a shadcncraft kit element as React, even if they do not say "shadcncraft" or "shadcn" explicitly. Also use when a user pastes a figma.com link or node ID and asks for the React/JSX, or asks to scaffold a page/section/component that exists in their Figma file. Prefer this skill over generic design-to-code because it reuses the matching shadcncraft registry block, keeps output on the project's design tokens, and emits icons from the project's configured library.
2026-07-02