Translates Figma designs into production-ready application code with 1:1 visual fidelity. Use when implementing UI code from Figma files, when user mentions "implement design", "generate code", "implement component", provides Figma URLs, or asks to build components matching Figma specs. For Figma canvas writes via `use_figma`, use `figma-use`.
这个条目提供什么？
figma-implement-design 是 ChatHome Skills 收录的 技能 条目，来源为 OpenAI Skills，质量分 90/100。 # Implement Design ## Overview This skill provides a structured workflow for translating Figma designs into production-ready code with pixel-perfect accuracy. I. 作为 agent 技能，它把一组可复用的任务指令打包成 Codex 和 Claude Code 等 AI 编程 agent 可直接加载的格式，无需为该任务手写胶水代码。 该条目由 ChatHome Skills 的每日抓取从官方 registry 和 GitHub 发现查询中收录，每次运行都会重新核验仓库事实、新鲜度信号和安装元数据。 质量分综合了官方 registry 收录情况、可用安装命令、许可证完整性、仓库活跃度和 GitHub star 趋势，完整算法说明见来源页。安装命令已列于上方，可直接复制使用。 在将 figma-implement-design 加入生产 agent 工作流前，请核对上方的最近更新日期和仓库状态——下方事实快照是最近一次抓取的时点值。
某个来源结构上无法提供的维度（registry 不提供 star 和许可证）不计入该条目的平均分，而不是记为 0 分，因此不同来源的条目仍可横向比较。
安全信号
扫描范围: 安装元数据与已收录的文档正文。
基于安装元数据和有界技能正文的自动风险信号，不是完整代码安全审计，也不会递归审查源码或依赖。
发现备注
# Implement Design ## Overview This skill provides a structured workflow for translating Figma designs into production-ready code with pixel-perfect accuracy. It ensures consistent
Repository-grounded threat modeling that enumerates trust boundaries, assets, attacker capabilities, abuse paths, and mitigations, and writes a concise Markdown threat model. Trigger only when the user explicitly asks to threat model a codebase or path, enumerate threats/abuse paths, or perform AppSec threat modeling. Do not trigger for general architecture summaries, code review, or non-security design work.