Figma Codegen
awdr74100/figwright/skills/figma-codegenby awdr7410079598afe1f1db45da83c1ca5e6678a6ba4ba6d4aNo license994 starsListed Oct 9, 2026Updated Oct 9, 2026Repository updated today
Generate framework-aware code from a Figma design. Reads the project's stack profile and emits code matching the existing framework (React/Vue/Svelte/Next/etc.) and styling (Tailwind/CSS/CSS-in-JS), reusing existing components and design tokens instead of regenerating from scratch. Triggers whenever the user wants a Figma design turned into code — e.g. 'code this design', 'implement this frame', 'build this screen/component', 'turn this Figma into React/Vue', 'convert this design to code' — or whenever a Figma URL or the current Figma selection appears alongside a coding request. Works for full screens, single sections, or one component.
Only the file list is public. File contents are available once the skill is installed in a workspace.
| Path | Size | Type |
|---|---|---|
| references/assets-and-icons.md | 5 KB | text/markdown |
| references/grounding.md | 26.6 KB | text/markdown |
| references/motion.md | 8.6 KB | text/markdown |
| references/responsive.md | 5.1 KB | text/markdown |
| references/stylesheets.md | 6 KB | text/markdown |
| references/verify.md | 2.3 KB | text/markdown |
| SKILL.md | 16.7 KB | text/markdown |
Source and attribution
Source:awdr74100/figwrightinskills/figma-codegenat commit79598af
License: No license
Content belongs to its original authors. SourceWeft indexes it from a public repository.
More in Software Development
Playground
anthropics
Builds self-contained interactive HTML playgrounds with controls, live preview, and copyable prompt output.
M5 Onboard
anthropics
Provisions M5Stack ESP32 boards by detecting them on USB, flashing UIFlow 2.0 firmware, and installing a MicroPython app bundle.
Cardputer Buddy
anthropics
Guides iterating on a Cardputer-Adv MicroPython app bundle: adding apps, pushing files over USB-serial, tailing logs, and running REPL commands.
Web Design Guidelines
vercel-labs
Reviews UI code against Web Interface Guidelines fetched from a remote source and reports findings as file:line entries.
Vercel React Native Skills
vercel-labs
React Native and Expo best-practice rules covering list performance, animation, navigation, UI patterns, state, and monorepo setup.
Vercel React Best Practices
vercel-labs
Vercel's React and Next.js performance guidelines, organized as 70 rules for writing, reviewing, and refactoring code.