用途:这是 Figma MCP 工作流中的前置技能,必须在调用 get_design_context 之前触发,用于登记技能使用情况并约束设计稿转代码的实现流程。
主要能力与要求:调用 get_design_context 时须在 skillNames 参数中包含 figma-design-to-code;若通过 MCP 资源加载,须加 resource: 前缀。首次调用须同时请求截图,作为实现必须匹配的视觉目标;若未返回截图,须直接调用 get_screenshot。若响应被标记为稀疏,不能直接用于实现,须将子节点 ID 与截图对应后,并行批量请求可见子节点以获得高保真响应。
实现方式:仅依据高保真响应实现,截图只作视觉目标,不得作为代码资源。编辑前须检查项目路径与已安装设计库依赖,复用或组合匹配的组件、资源与 token,避免原始标记、内联样式或硬编码;仅在无法准确表达设计时才修改或补充。Code Connect 须精确应用于映射节点并直接复用连接组件。静态资源须按设计中的确切位置使用,不得省略、编辑、重绘、内联或错误替换;SVG 根节点的宽高属性不得覆盖,避免 100%×100% 尺寸。所有静态资源须按响应说明下载,代码中不得残留临时 Figma 资源 URL。
验证:仅验证所请求的屏幕或组件,记录但不修改范围外的既有不匹配;须校验每个可见静态资源的本地文件、设计槽位、调用点与渲染几何是否正确,完成前修复所有范围内不匹配。
限制:资料未提供具体安装命令、收费、价格、平台与效果信息。