'code-connect' 검색 결과

Link Figma design components with their code counterparts through Code Connect, helping design-system updates flow into the codebase. This catalogue entry points agents toward the full upstream workflow.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Linking Figma components to code components
• Reflecting design-system updates in code
• Introducing a Code Connect workflow

Create and maintain Code Connect templates that link published Figma components to existing code components. Map text, variants, visibility settings, and nested components so the displayed code snippets reflect the selected design properties.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Linking Figma components to existing code components
• Creating Code Connect template files
• Mapping design variants to code properties

Find code components that match Figma design components by comparing names, structure, and settings. Presents candidates for approval, then creates Code Connect mappings, explicit links between design components and their implementations.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Link a Figma button to its code component
• Find unconnected components within a frame
• Compare similar implementation candidates

Create and maintain Code Connect templates that link published Figma components to existing code components. Map text, variants, toggles, and nested components so code examples reflect the selected component's design settings.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Connect published Figma components to existing code
• Map design variants to component properties
• Reflect configurable nested components in code examples

Turn a Figma design into code that fits an existing project. Reuse its components and shared style values, follow designer notes and component mappings, and adapt Figma's reference output to the project's framework and conventions.

한국어 요약은 준비 중입니다. 영어 요약을 표시하고 있습니다.

• Implementing a screen from a Figma design
• Reusing existing project components in a design implementation
• Applying designer notes and shared style values

Creates and maintains Figma Code Connect files (`*.figma.tsx`) that map Figma components to code via the parser-based `figma.connect()` API. Use when the user mentions Code Connect, Figma component mapping, design-to-code translation, or asks to create/update .figma.tsx files.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

Read-first Figma gateway via Figma MCP: analyze designs, implement Figma-to-code for 1–3 screens, extract design tokens, produce a Figma Evidence Packet for planning handoff, screenshot fallback. Advanced operations (Code Connect, canvas writes, design-system/library patterns) are gated references loaded only on explicit intent. Triggers: 'figma', 'design link', 'implement this design', 'design tokens', 'produce a Figma Evidence Packet'.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

Creates and maintains Figma Code Connect template files that map Figma components to code snippets. Use when the user mentions Code Connect, Figma component mapping, design-to-code translation, or asks to create/update .figma.ts or .figma.js files.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.