figma-generate-design - Build Figma Screens from Code
Translates application pages and views into Figma using published design system components and variables.
Tags
Updated: 2026-05-09Capabilities
Typical Inputs
Typical Outputs
What this skill does
- create screens
- update screens
- create views
- update views
- create modals
- update modals
- create dialogs
- update dialogs
- create drawers
- update drawers
- create panels
- update panels
- create sidebars
- create landing pages
- build layouts
Inputs
- source code
- screen description
- Figma file URL
- Figma file key
- published design system
- image files
Outputs
- Figma screens
- Figma views
- Figma modals
- Figma dialogs
- Figma drawers
- Figma panels
- Figma landing pages
Requirements
- Figma MCP server
- tool use support
- published design system
- figma-use dependency