Figma 设计系统规则生成器
为 Figma-to-code 项目生成符合代码库约定的设计系统规则。
文档明确要求访问代码库并连接 Figma MCP，且规定使用 Figma 返回的资源、避免新增图标包，具备一定范围约束；但未说明敏感数据处理、数据流、用户确认、权限最小化、外部写入确认或回滚机制，Figma 外部依赖的风险披露也不足，因此扣分。
工作流步骤、参数和异常场景（响应过大或截断）有说明，且提供了一个检查 AGENTS.md 的脚本；但核心 MCP 工具依赖未在文件中验证，代理识别、保存失败、工具不可用和规则冲突的反馈不足，测试仅被要求执行而无静态证据，故按静态上限保守扣分。
触发语句、目标用户场景、支持的代理和输入参数较清楚；但核心功能完全依赖 Figma MCP，未说明中国大陆网络可达性，也未充分界定无 Figma、非 Figma-to-code 或不支持代理时的非适用范围，中文支持未声明，因此扣分。
文档结构清晰，包含前置条件、模板、示例、限制提示和常见问题；但单项许可证未知，仓库 README 标明已弃用，版本、变更记录、维护责任和更新路径不清晰，且部分规则依赖占位符，故扣分。
目标是生成并保存项目级设计规则，流程和示例使核心产出看起来可用；但静态材料没有证明 MCP 调用、规则保存或最终验证实际成功，生成内容仍需项目分析、人工审阅和迭代，按静态校准不超过 7。
SKILL.md、配置、模板和脚本提供了可审计的一手材料，并引用了 Figma 文档；但没有提交的测试套件、CI 覆盖或第三方执行证据，关键能力无法由静态文件独立复现，因此仅给有限分数。
- 核心功能依赖外部 Figma MCP 服务；需确认服务可用性、网络可达性及项目数据发送范围。
- 保存规则前未明确要求用户确认，也未提供覆盖、回滚或失败恢复流程。
- 仓库已标记为弃用，许可证、维护责任和后续更新路径应在采用前核实。
- 示例包含多个占位符，生成结果需要人工审阅，不能直接视为适用于目标代码库。
它能做什么 & 适用场景
该技能分析项目代码库，并为 Figma 驱动的实现生成项目专属设计系统规则。它要求连接可访问的 Figma MCP 服务器，并使用其工具获取基础提示与模板。生成的规则可保存为 Claude Code 的 CLAUDE.md、Codex CLI 的 AGENTS.md 或 Cursor 的规则文件。它适合需要统一组件、样式、设计令牌和资源处理方式的前端团队。
调用 Figma MCP 服务器的 create_design_system_rules 工具，传入项目使用的语言和框架；分析组件目录、样式方案、设计令牌、命名方式、架构、路由和状态管理等代码库模式；生成包含组件、样式、Figma MCP 集成、资源处理和项目约定的规则；根据使用的编码代理将规则保存到 CLAUDE.md、AGENTS.md 或 .cursor/rules/figma-design-system.mdc；最后建议通过简单的 Figma 组件实现进行验证和迭代。
- 使用 Figma 设计启动新前端项目，需要先建立组件和样式约定。
- 将现有项目交接给 AI 编码代理，希望代理遵循已有目录、命名和设计令牌模式。
- 团队需要统一多个 Figma-to-code 实现中的组件复用、资源下载和视觉校验流程。
- 已有设计系统规则过时，需要根据当前代码库重新生成或细化。
- 使用 Cursor、Codex CLI 或 Claude Code，并希望将 Figma 实现规范写入对应规则文件。
优缺点一览
- 覆盖组件组织、样式、设计令牌、Figma MCP 流程、资源处理和项目约定。
- 支持 CLAUDE.md、AGENTS.md 和 Cursor 规则文件。
- 要求先获取设计上下文和截图，再处理资源并实现，有明确的 Figma-to-code 流程。
- 规则内容强调复用现有组件、避免硬编码并进行视觉校验。
- 必须连接可访问的 Figma MCP 服务器。
- 必须能够读取和分析目标项目代码库。
- 生成结果依赖项目实际模式，源材料未提供自动验证工具或测试套件。
- AGENTS.md 有 32 KiB 合并大小限制；Cursor 配置还需要匹配实际代码目录的 globs。
- 仓库 README 已声明该仓库弃用，建议关注 OpenAI Plugins repository 的当前示例。
如何安装
这是 openai/skills 仓库中的 curated 技能。按照仓库 README，可在 Codex 中使用 $skill-installer 安装 curated 技能，例如：$skill-installer figma-create-design-system-rules。安装后重启 Codex 以加载技能。仓库未提供该技能的单独许可证信息；README 说明许可证应位于技能目录的 LICENSE.txt 中。
如何使用
确保 Figma MCP 服务器已连接，并允许访问项目代码库。使用类似“Create design system rules for my React project”或“为我的 Vue 项目生成 Figma 设计规则”的请求触发技能。提供项目使用的语言和框架；技能会先调用 create_design_system_rules，再分析代码库并生成规则。若无法确定使用哪个编码代理，应检查现有规则文件或询问用户。