서우 AgentOffice
← 라이브러리
creative-design

Figma Implement 디자인

원문: figma-implement-design

Translate Figma nodes into production-ready code with 1:1 visual fidelity using the Figma MCP workflow (design context, screenshots, assets, and project-convention translation). Trigger when the user provides Figma URLs or node IDs, or asks to implement designs or components that

무엇을 하나요

Implement Design Overview This skill provides a structured workflow for translating Figma designs into production ready code with pixel perfect accuracy. It ensures consistent integration with the Figma MCP server, proper use of design tokens, and 1:1 visual parity with designs. Prerequisites Figma MCP server must be connected and accessible User must provide a Figma URL in the format: https://figma.com/design/:fileKey/:fileName?node id=1 2 :fileKey is the file key 1 2 is the node ID (the specific component or frame to implement) OR when using figma desktop MCP: User can select a node directly in the Figma desktop app (no URL required) Project should have an established design system or comp

실행 시 본인 API 키(BYOK)로 동작하며, 모델 비용은 사용자 계정에서 직접 결제됩니다.