
✏️ 介绍
Figmentation 是一款用于自动生成 Figma 设计文档和 Token 标注的插件。它可以从组件中自动提取颜色、字体、间距、边框和效果等设计 Token,并在组件旁边生成结构化说明,适合设计系统维护、开发交付和 UI 组件文档整理。
🔨 功能
1. 自动提取组件中绑定的 Design Token
2. 支持颜色、字体、间距、边框、阴影、模糊等多种属性
3. 可识别背景色、文字颜色和描边颜色
4. 支持提取字号、字体、字重、行高和字间距
5. 支持提取 Padding、Gap、圆角和 Stroke Width
6. 可自动在组件旁生成清晰的 Annotation 标注区域
7. 支持 camelCase、kebab-case 等多种命名方式
8. 优先保留现有 Token 名称,没有名称时可生成备用命名
9. 适合 Design System、组件库和开发 Handoff 场景
10. 可减少重复手动标注和维护设计文档的工作量

✏️ 介绍
这是一款用于检查 Figma 文件中组件使用情况的插件。它可以扫描整个文件,找出哪些组件从未被使用,同时统计每个组件被使用了多少次,适合整理组件库和清理冗余资源。
🔨 功能
1. 扫描整个 Figma 文件中的组件
2. 找出所有未被使用的 Component
3. 统计每个组件的使用次数
4. 帮助识别冗余或废弃组件
5. 适合设计系统维护和组件库清理场景

✏️ 介绍
Supa Design Tokens 是一款用于在 Figma 中创建、管理和导出 Design Token 的插件。它可以把颜色、字体、阴影、间距、圆角、断点等设计规范快速生成成 Figma Variables 和 Styles,并支持导出给开发使用,适合搭建设计系统和统一设计规范。
🔨 功能
1. 支持生成 Color、Typography、Effects、Dimensions、Layout 等多类 Design Token
2. 可自动生成完整颜色体系,支持 P3、OKLCH、亮度、透明度和对比度控制
3. 支持批量生成字体层级,包括 Heading、Body 和自定义 Text Style
4. 可设置字体、字号、字重、行高、字间距和命名规则
5. 支持生成阴影、模糊、Spacing、Size、Border Radius 等 Token
6. 支持 Breakpoint 和 Container 等响应式布局 Token
7. 内置 Tailwind、Material UI 等常见设计系统 Token,可快速复用
8. 可一键同步为 Figma Variables 和 Styles
9. 支持批量管理大量 Token,并提供搜索能力
10. 支持导入现有 Figma Token 或符合 DTCG 规范的 JSON
11. 支持导出 CSS、Tailwind、SCSS、JSON 等开发格式
12. 可在 Figma 中自动生成卡片、表格和 Tile 形式的 Token 文档
13. 支持查看颜色可访问性和对比度信息
14. 支持直接编辑 Token Code,方便做更细致的自定义
15. 适合设计系统、团队协作和设计开发交付场景

✏️ 介绍
Component Inventory 是一款用于快速查看和盘点 Figma 组件库的插件。它会自动扫描当前文件中的所有 Component 和 Component Set,并把每个组件生成一个 Instance 集中放到新的页面里,方便查找组件和检查设计系统。
🔨 功能
1. 自动创建一个新的 Component Inventory 页面
2. 扫描当前 Figma 文件中的所有页面
3. 查找所有 Component 和 Component Set
4. 为每个组件生成一个 Instance 并集中展示
5. 方便快速浏览和查找组件
6. 适合做 Design System 盘点和组件库审查
7. 支持设置扫描深度,只包含指定层级内的组件
8. 可通过 Figma Quick Actions 快速调用并设置搜索深度

✏️ 介绍
PaletteFlow 是一款用于在 Figma 中快速查找和管理配色方案的插件。它提供 100,000+ 经过整理的专业色板,可以按氛围、风格或颜色浏览,并一键添加为 Figma Local Variables,适合 UI、品牌、网页和设计系统配色。
🔨 功能
1. 提供 100,000+ 专业整理的配色色板
2. 支持按 Mood、Style 或 Color 浏览和筛选
3. 可一键把整套色板添加为 Figma Local Variable Collection
4. 方便后续统一管理和更新设计系统中的颜色
5. 支持从起始颜色生成互补色、邻近色等配色方案
6. 可从图片中提取颜色,快速生成对应色板
7. 支持保存和管理自己的配色方案
8. 适合 UI/UX、品牌、Web 和产品设计中的配色探索
9. 有助于保持不同页面、组件和产品触点之间的颜色一致性
10. 适合快速建立或补充 Design System 的颜色体系
.png)
✏️ 介绍
这是一款用于把现有 Figma Typography Styles 转换成 Variables 的插件。它可以读取当前文件中的文字样式,并自动生成对应的字体相关变量,适合设计系统升级和 Typography Token 管理。
🔨 功能
1. 读取现有的 Figma Text Styles
2. 自动生成 Font Family 变量
3. 自动生成 Font Weight 变量
4. 自动生成 Font Size 变量
5. 自动生成 Line Height 变量
6. 自动生成 Paragraph Spacing 变量
7. 自动生成 Letter Spacing 变量
8. 自动生成 Paragraph Indent 变量
9. 适合把现有文字样式整理成更系统化的 Typography Variables