
✏️介绍:
AutoSpec 是一款可以自动生成设计标注的 Figma 插件。它会读取你选中的图层、Frame 或组件,并在设计旁边自动生成结构化的说明文档,一键把组件整理成清晰、可编辑的设计规范,方便设计交付和开发查看。
🔨 功能:
1.一键将 Frame 和组件转换为结构化标注文档
2.自动为图层编号,并生成高亮覆盖和完整图例
3.自动展示填充、描边、字体、尺寸、间距、圆角等信息
4.支持识别并展示 Figma Variables 和 Styles
5.文档会直接生成在设计旁边,方便查看和编辑
6.自动整理成清晰易读的 Spec Frame,提升设计交付效率
7.目前支持 Anatomy,可自动拆解组件结构并展示对应属性
8.后续将支持 Measure、Properties 和 Property Table,用于尺寸标注、组件属性和开发交付
使用方式也很简单:选中图层或组件 → 选择文档类型 → 点击 Generate,即可自动生成。

✏️ 介绍
这是一款用于把 Figma 样式快速转换成 CSS 自定义变量的插件。你可以选择颜色格式,并决定文字尺寸是否使用 REM,插件会自动整理命名并生成可直接用于前端开发的样式变量。
🔨 功能
1. 将 Figma 颜色样式导出为 CSS Variables
2. 支持 RGBA、HEX、HSLA 三种颜色格式
3. 支持将文字尺寸导出为 REM 单位
4. 可将 Effects 转换为 `box-shadow`
5. 可将模糊效果转换为 CSS `blur`
6. 自动把 Figma 分组命名转换为双短横线格式
7. 自动将空格、camelCase 转换为 kebab-case
8. 自动移除特殊字符,方便直接用于代码
9. 目前只支持纯色,不支持渐变和图片填充
10. 如果一个样式包含多个颜色,只会导出第一个颜色

✏️ 介绍
Specs Classic 是一款用于自动生成 Figma 页面和组件设计规格说明的插件。选中组件、实例或 Frame 后,可以快速整理出对应的 Specs,适合设计交付、组件文档和开发协作。需要注意的是,Specs Classic 已停止维护,官方建议改用 Specs 2。
🔨 功能
1. 自动生成页面和组件的设计规格说明
2. 支持 Component、Instance 和 Frame
3. 适合设计交付、组件文档和开发协作
4. 可减少手动标注和整理规格的工作量
.png)
✏️ 介绍
这是一款用于快速检查 Figma 文字样式的插件。它可以扫描选中的区域,整理其中使用到的所有文字样式,帮助你发现字体、字号等样式差异,更适合做设计规范检查和样式统一。
🔨 功能
1. 支持同时扫描多个选中的图层或区域
2. 一键分析当前选区中使用到的所有文字样式
3. 快速查看不同文字样式的使用情况
4. 点击某个样式即可高亮所有使用该样式的图层
5. 适合检查字体差异、统一文字规范和整理设计稿
.png)
✏️ 介绍
这是一款用于在 Figma 中快速添加 CTA 按钮的插件。可以一键插入现成按钮,并继续调整样式和交互状态,适合网页、落地页和产品界面快速搭建。
🔨 功能
1. 一键添加 Call to Action 按钮
2. 支持自定义按钮样式
3. 可添加箭头等辅助元素
4. 支持切换不同主题
5. 可开启或关闭 Hover 状态
6. 适合快速制作网页、营销页和产品界面的操作按钮
.png)
✏️ 介绍
这是一款用于快速生成多尺寸图标组件变体的 Figma 插件。选中一个图标 Instance 后,它可以自动创建不同尺寸的 Variant,并按比例调整描边粗细,适合整理图标库和设计系统。
🔨 功能
1. 根据选中的图标 Instance 自动创建新的 Component Variants
2. 默认生成 12、16、24 三种尺寸
3. 支持自定义 Variant 名称和尺寸
4. 可为不同尺寸分别设置 Stroke Width
5. 描边图标可按比例调整线宽,保持不同尺寸下的视觉平衡
6. 可选择创建完成后删除原始图层
7. 适合快速搭建和维护多尺寸图标组件库