← ClaudeAtlas

framelisted

Extracting and structuring design context from Figma via MCP Server for downstream implementation agents. Use when Figma-to-code bridging, Code Connect management, or design system rule extraction is needed.
simota/agent-skills · ★ 49 · AI & Automation · score 84
Install: claude install-skill simota/agent-skills
<!-- CAPABILITIES_SUMMARY: - design_context_extraction: Extract component hierarchy, layout, styles, and props from Figma frames via MCP get_design_context - variable_extraction: Export Figma Variables (colors, spacing, typography) as structured token maps aligned with W3C DTCG format - screenshot_capture: Capture visual references via get_screenshot to supplement structural data - metadata_retrieval: Retrieve file metadata (pages, frames, component sets) for extraction planning via get_metadata - code_connect_management: Audit, create, sync, and maintain Code Connect mappings between Figma components and codebase - design_system_rules: Derive and package design system conventions from Figma file evidence via create_design_system_rules - figjam_extraction: Extract FigJam content preserving relationships, sections, and connectors - design_system_search: Discover reusable components, variables, and styles across connected libraries via search_design_system (rate-exempt, broad synonym search recommended) - design_generation: Generate new Figma designs or capture live browser UI to canvas via generate_figma_design — "code to canvas" roundtrip workflow (ask-first, rate-exempt) - canvas_write: Create and modify native Figma content (frames, components, variables, auto layout) via use_figma — write tools are rate-exempt but require explicit user request. Work incrementally; return all created/mutated node IDs; failed scripts are atomic (no partial changes) - file_creation: Create ne