关于 figma-catalogue
figma-catalogue 是面向 Figma、设计转代码工作流、设计令牌和官方平台套件的领域导航目录，帮助用户查找适合设计工具与代码工作流的技能。
主要功能
- 01整理 Figma 和设计转代码技能
- 02列出设计令牌管理技能
- 03涵盖官方平台技能套件
- 04指向完整目录 design-catalogue
适用场景
- 01查找 Figma 转代码工作流技能
- 02寻找提取或管理设计令牌的技能
- 03浏览官方平台技能套件
安装
复制下面的命令，在终端中运行。
$
npx skills add https:/安装后在 Claude Code 中输入/figma-catalogue确认已加载。
附带文件stub.yaml
详细介绍
figma-catalogue
Figma、设计转代码工作流、设计令牌和官方平台套件的领域导航。 当用户需要连接设计工具与代码的技能时，启用此目录。
→ 如需查看所有领域的完整目录，请使用 design-catalogue。
适用场景
在用户出现以下需求时启用：
- 询问 Figma 转代码或代码转 Figma 工作流
- 需要管理或提取设计令牌
- 想要使用设计系统
- 询问官方技能套件（Anthropic、Vercel、Expo、Figma）
Figma 与设计转代码
| 技能 | 最适合 |
|---|---|
figma-official-skills | 7 个官方 Figma 技能：实现、生成、库、代码连接 |
openai-skills | OpenAI 的 9 个技能：Figma + 前端 + 幻灯片 + imagegen |
google-stitch-skills | 6 个 Stitch 技能：design-md、react-components、shadcn、loop |
extract-design-md | 将 Stitch 输出提取为 DESIGN.md 格式 |
claude2figma | 4 个强制遵循令牌规范的技能：颜色／字体／间距 → Figma 变量 |
work-with-design-systems | 双模式：检查（WCAG 审核）+ 构建（分 6 个阶段并绑定变量） |
figma-variables-tokens-generator | 问卷 → W3C 令牌 ZIP + 用于导入的 Figma 插件 |
figma-skill | Figma API + 社区资源 → 设计令牌 → 7 个框架 |
extract-design-system | 从任意在线网站逆向提取令牌 → tokens.json + tokens.css |
design-tokens-skill | W3C DTCG 令牌规范：OKLCH、引用／别名、Terrazzo、Figma 导出 |
官方平台套件
| 技能 | 最适合 |
|---|---|
anthropics-skills | 6 个 Anthropic 技能：frontend-design、artifacts、canvas、theme、brand、pptx |
vercel-skills | 4 个 Vercel 技能：web-design-guidelines、components、React 最佳实践 |
microsoft-skills | 2 个 Microsoft 技能：设计评审、深色主题 React |
software-mansion-skills | Software Mansion 官方技能：RN 动画、手势、SVG、设备端 AI |
callstack-agent-skills | Callstack 官方技能：RN 最佳实践、性能分析、Turbo Modules、升级 |
expo-skills | Expo 官方技能：Expo SDK、EAS Build/Submit、Expo Router |
评论
支持 Markdown