sync-figma-token-skill
同步代码与Figma设计变量，打通设计与开发流程。
安装使用
复制下面这段提示词发给你的 AI（Claude / Cursor / TRAE / Codex / WorkBuddy 等），它会自动帮你完成安装：
帮我安装这个 AI Skill：sync-figma-token-skill。 它的用途是：同步代码与Figma设计变量，打通设计与开发流程。 完整的 Skill 内容见：https://321skill.com/skills/sync-figma-token-skill/raw/index.md 请读取该页面内容，如果是 SKILL.md 格式直接安装，如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接，AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
“请使用sync-figma-token技能，将Figma文件[文件ID]中的设计变量同步到本项目src/tokens目录下，生成TypeScript文件。”，它会要求你提供Figma访问令牌，然后自动获取变量并生成对应的代码文件，完成同步。
介绍
这个Skill旨在解决设计与开发团队之间长期存在的“设计令牌”不同步问题。设计令牌（如颜色、间距、字体等变量）在Figma中定义后，需要手动同步到代码库中，这个过程容易出错且效率低下，导致设计与最终产品不一致。
使用此Skill，开发者或设计师可以通过简单的命令行指令，将Figma文件中定义的设计变量（Figma Variables）自动提取并同步到项目的代码文件中，生成对应的CSS变量、SCSS变量、JavaScript常量或设计令牌JSON文件。这确保了设计系统在设计和代码两端始终保持单一事实来源。
它非常适合前端开发者、UI工程师、全栈开发者以及希望建立或维护统一设计系统的团队。对于使用Figma进行设计并需要将设计规范落地到代码中的项目，此Skill能显著提升协作效率和一致性。
与同类工具相比，它直接深度集成于AI Agent工作流中，作为一项可调用的Skill存在，而非一个独立的CLI工具或构建插件。这意味着它可以在更广泛的自动化脚本和AI驱动的开发流程中被灵活调用，实现设计令牌同步的智能化与场景化。
核心特点
核心区别在于它作为AI Agent的Skill，能无缝嵌入AI驱动的自动化工作流，而不仅仅是独立的构建工具；它直接对接Figma Variables API，实现设计与代码变量的精准双向同步（或单向导出）。
注意事项
不适合仅使用其他设计工具（如Sketch、Adobe XD）或未启用Figma Variables功能的团队。
常见问题
如何获取Figma访问令牌？
需要在Figma账户设置中生成个人访问令牌（Personal Access Token），并赋予文件读取权限。
支持导出哪些代码格式？
通常支持CSS、SCSS、JavaScript、JSON等格式，具体需查看Skill文档说明。
给 AI 助手的安装指引
如果你的 AI 编程助手（Claude Code、Cursor、TRAE 等）能看到这个页面，把下面这段发给它即可自动完成安装：
请访问 https://321skill.com/skills/sync-figma-token-skill/raw/index.md 读取 sync-figma-token-skill 的原始 Skill 定义（Markdown 格式），按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址：/skills/sync-figma-token-skill/raw/index.md（查看排版版本）