LogoClawIndex
案例技能关于
LogoClawIndex

figma-to-code - Figma 转代码精确还原技能

严格按照 Figma 设计稿精准还原代码，禁止任何凭空推测、近似替代或自行修改。

标签

更新于: 2026-09-22
figma前端UI还原代码生成mcp

能力

提取精确设计属性下载真实设计资产还原布局与组件使用截图校验视觉

典型输入

Figma 设计文件与节点 IDFigma MCP 资产 URL

典型输出

像素级精准的 HTML 和 CSS 代码已下载的图像与 SVG 资产视觉比对校验报告

该技能可以做什么

  • 提取精确设计属性
  • 下载真实设计资产
  • 还原布局与组件
  • 使用截图校验视觉
  • 实现交互组件状态

输入

  • Figma 设计文件与节点 ID
  • Figma MCP 资产 URL

输出

  • 像素级精准的 HTML 和 CSS 代码
  • 已下载的图像与 SVG 资产
  • 视觉比对校验报告

要求

  • Figma MCP 服务
  • cURL 工具

来源

  • 规范: SKILL.md

ClawIndex

OpenClaw Skills 与 Use Case 索引

ClawIndex 是一个生态驱动的 OpenClaw Skills 与真实 Use Case 索引站。

索引

Skills·
Cases

Meta

关于·
声明·
邮箱·
GitHub
© 2026 ClawIndex 保留所有权利。