/pix: The Pixel-Perfect Autonomous Loop

User provides a Figma link. You implement it pixel-perfect. That's it.

Tool names may vary based on your MCP configuration (e.g., figma__get_screenshot or mcp__figma__get_screenshot). Run /mcp to see available tools.

Resource Strategy

Tool Costs

Tool	Cost	Use For
`get_metadata`	Cheap	Node tree with child IDs, positions, sizes. No styling.
`get_variable_defs`	Cheap	All design tokens (colors, spacing, radii) as name→value.
`get_code_connect_map`	Cheap	Check which Figma nodes map to existing code components.
`get_screenshot`	Medium	Visual image of a specific node. Target a `nodeId` to crop/zoom.
`get_design_context`	Expensive	Full code + styling + assets. NEVER call on a large parent — call on individual sections.

Core rule: Cheap calls first to build a map, then expensive calls only on the smallest necessary nodes.