dx-figma-extract

Yes, extracting Figma design context for UI prototype generation automatically captures design tokens, UI components, and visual references. This eliminates manual data gathering and prepares a structured markdown file with reference images for immediate use in design QA and prototyping.

To capture Figma variable definitions and screenshots for a specific story, provide the Figma URL and story ID, then trigger the extraction command. The system generates a per-story figma-extract.md file containing all relevant design tokens and reference images.

Yes, you need the Figma desktop app running to extract design tokens via MCP, because the extraction process communicates locally through port 3845. This connection is required to access the design context, variable definitions, and screenshots.

You should extract Figma design context during the requirements phase when a story includes a Figma URL. Capturing design tokens and visual references at this stage ensures downstream prototype generation and design QA have accurate data without manual gathering.