design-to-component-translator

SKILLWorkflowcommunity
v0.0.0patricio0312revMITUpdated 8mo agoSource →

Converts Figma/design specifications into production-ready UI components with accurate spacing, typography, color tokens, responsive rules, and interaction states (hover, focus, disabled, active). Generates Tailwind/shadcn code with design system tokens mapping. Use when translating "Figma to code",

Community-submitted skill. Not yet reviewed by the Forge team. Full prompt content may not be available.Request review →
56Repo stars
1Clients
1Formats
8mo agoLast update
Skill
Authorpatricio0312rev
Version0.0.0
LicenseMIT
CategoryWorkflow
Formatsskill.md
PromptNot published
Compatibility
Claude✓ Supported
Cursor—
Copilot—
ChatGPT—
Gemini—
About

Converts Figma/design specifications into production-ready UI components with accurate spacing, typography, color tokens, responsive rules, and interaction states (hover, focus, disabled, active). Generates Tailwind/shadcn code with design system tokens mapping. Use when translating "Figma to code", "design specs to components", or "implement design system".

Keywords
skillclaude

No dependency coverage

This entry publishes no npm package, so Forge has no dependency tree for it. That is a gap in coverage — not a statement that it has no dependencies.

Topics

Related in design tools