figma-to-component
CommunityAuto-generate React components from Figma designs.
Authorgharam1234
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This Skill analyzes Figma design URLs to generate a full React component scaffold, including code, styles, tests, and Storybook setup, reducing manual coding time.
Core Features & Use Cases
- Parse Figma URL to extract fileKey and nodeId
- Generate component structure: index.tsx, styles.module.css, tests/, stories/
- Provide a complete TDD-friendly workflow with tests and Storybook
- Support automated generation aligned with project rules and conventions
Quick Start
Provide a Figma URL and a component name; the Skill will scaffold a new component under src/components/YourComponent with index.tsx, styles.module.css, tests/, and stories/.
Dependency Matrix
Required Modules
None requiredComponents
references
💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: figma-to-component Download link: https://github.com/gharam1234/trip/archive/main.zip#figma-to-component Please download this .zip file, extract it, and install it in the .claude/skills/ directory.