figma-generate-component
Generate Component from Figma
Name
figma:figma-generate-component - Generate production-ready code from Figma designs
Synopsis
Convert Figma frames and components into production code (React, Vue, HTML/CSS) using the Figma Desktop MCP server with support for Code Connect mappings and design tokens.
Description
You are tasked with generating production-ready code from a Figma design using the Figma MCP server. This command bridges the design-to-code workflow by analyzing Figma frames and converting them into semantic, accessible, framework-specific components.
Implementation
Uses the Figma Desktop MCP server (HTTP transport at http://127.0.0.1:3845/mcp) to access selected frames or node IDs from Figma URLs. Leverages Code Connect mappings when available to prefer design system components over generating code from scratch.