Figma to SwiftUI Implementation Skill

Translate Figma nodes into production-ready SwiftUI views with pixel-perfect accuracy. Combines MCP integration rules with a structured implementation workflow for iOS projects.

Prerequisites

• Figma MCP server must be connected and accessible
• User must provide a Figma URL, e.g.: https://www.figma.com/design/:fileKey/:fileName?node-id=3166-70147&m=dev
  • May include &m=dev or other query params — only node-id matters
  • :fileKey — path segment after /design/
  • node-id value — the specific component or frame to implement
• OR when using figma-desktop MCP: select a node directly in the Figma desktop app (no URL required)
• Xcode project with an established SwiftUI codebase (preferred)
• Optional .txt / .md / ticket / brief describing scope, behavior, actions, and states

MCP Connection

If any MCP call fails because Figma MCP is not connected, pause and ask the user to configure it. See references/figma-mcp-setup.md for troubleshooting.