Figma 设计标注：先别急着装插件

「做完设计要标尺寸」「给开发写交付标注」「画 Redline」——很多人一上来就搜「Figma 标注插件」。多数时候，自带测距和 Dev Mode 标注已经够用。

先说结论：

• 自己核对间距：选中一层，按住 Option（Mac）/ Alt（Windows） 悬停另一层，即可看到红线距离；任意计划可用，但不能保存、不能分享给别人。
• 要留给别人看的尺寸线：用工具栏 Measurement（快捷键 Shift M）拖出可保存的测量；付费计划、Full 席位且有编辑权限。
• 要给开发写说明、钉属性：用 Annotation（快捷键 Shift T）写备注或 + Property；开发在 Dev Mode 里能看到，设计改了属性标注会跟着更新。
• 要把尺寸线画成画布上的图层、批量出 Spacing/Padding，或对方没有 Dev Mode / 付费席位：再考虑 Measure、DesignDoc、Redlines、Spaciiing 这类插件。

自带步骤来自 Figma 官方帮助：Measure distances between layers、Add measurements and annotate designs、Guide to inspecting、Guide to Dev Mode。插件只写觅件详情里能核对的信息；没有在你的文件里代跑过界面，打开后跟说明不一致，以你看到的为准。

用中文找插件的方法，见 用中文找 Figma 插件。

1. 先用自带：Option / Alt 测距

官方说明：任意计划；有 view 或 edit 权限即可。选中第一个对象，按住修饰键悬停第二个对象，Figma 会显示红线以及水平、垂直距离。嵌套在 Frame、组或组件里的对象也能测。

怎么测

1. 在画布上选中第一个对象。
2. 按住修饰键：
   • Mac：⌥ Option
   • Windows：Alt
3. 把鼠标悬停到第二个对象上。
4. 画布会出现红线与测量数值。

适合：设计过程中自己核对间距、和 Auto Layout 对照。

不适合：要写进交付稿、截图给外包、或对方需要长期看到尺寸——官方明确写了：这种测量不能保存、不能分享。那种用下一节的 Measurement，或后面的插件把尺寸画进图层。

2. 可保存的尺寸：Measurement（Shift M）

官方说明：付费计划；Full 席位且 can edit 可添加；Full 或 Dev 席位且至少 can view 可查看。和 Option/Alt 临时测距不是一回事——这里拖出来的测量会留在文件里，别人也能看到。

怎么加

1. 点工具栏 Measurement，或按 Shift M。
2. 悬停图层，看起点可选位置。
3. 从起点拖到要量到的图层终点。
4. 再拖动测量线，避免挡住设计。
5. 可双击测量文字做自定义（官方原文：double-click on the measurement to customize its text）。

删除：点中该测量，按 Delete / Backspace。

适合：交付前固定几处关键间距、让开发在画布上直接看到。

不适合：要批量给整页组件自动铺满 Spacing / Margin / Padding 标注——自带是手工拖，批量场景看插件节。

3. 给开发写说明：Annotation（Shift T）

官方说明：同样在付费计划下；可从 Design 或 Dev Mode 添加。注解可绑图层属性（如对齐方向、尺寸），也可写自由文本；设计后续改了，属性类标注会保持更新。开发在 Dev Mode 里默认能看到（画布上绿色圆点，点开看内容）。

怎么加

1. 点工具栏 Annotation，或按 Shift T。（也可先 Shift D 进 Dev Mode，再点 Annotate。）
2. 选中要标注的图层。
3. 在文本框写备注，或点 + Property 从列表选属性。同一条注解可同时含纯文本和属性。

分类与筛选

文件自带分类：Development、Interaction、Accessibility、Content。编辑者可改、删默认分类，也可新建（分类只作用于当前文件）。

筛选：在画布注解上右键 → Filter by；或在 Dev Mode 右侧缩放菜单里悬停 Annotations 再选分类。

隐藏全部注解：主菜单 → View → 取消勾选 Annotations。

删除：点中注解，按 Delete / Backspace。

适合：交互说明、无障碍提醒、开发注意点——和尺寸线分开，开发不会漏看。

不适合：对方只有 Starter / 没有 Dev Mode 席位、或必须把规格「画」成可导出 PNG 上的红线图层。官方也写了 Starter 要升级或把文件放到付费团队才能用 Dev Mode。那种场景再考虑插件把 Redline 生成到画布上。

4. 何时才需要标注插件

自带已经覆盖：自己测距、可分享的 Measurement、给开发看的 Annotation。下面几种才值得装插件：

• 要把宽高、间距画成画布图层（方便截图、贴文档、对方不看 Figma Dev Mode）。
• 要批量给 Frame / Auto Layout 生成 Spacing、Margin、Padding。
• 要自定义单位（PX、%、DP）、描边样式，或顺带画 User Flow 箭头。

下面几款来自觅件「📌 标注&便签」分类，介绍均来自插件详情，不编未核对的按钮名。

Measure丨设计标注

作者 Philip and carlhauser。觅件当前标免费。

详情写明：快速给设计稿加宽高、距离和空白区域等 Redline；适合设计检查和开发交付。

适合：少量关键尺寸、界面简单、想快速出 Redline。

不适合：你其实只是自己核对一下——Option/Alt 更快；或团队已全面用 Dev Mode Annotation。

安装时若提示与「免费」不符，以安装时提示为准。

DesignDoc丨设计稿标注

作者 Marka Plugin Dev。觅件标免费。

详情写明：可显示 Spacing、Margin、Padding 等；选中 Frame 后自动加测量标记；支持扫描嵌套 Frame、批量为嵌套结构生成标注；对 Auto Layout 支持较好。

适合：组件库整理、整块 Frame 要铺开间距信息。

不适合：只要钉一条开发备注——用自带 Annotation。

同样不编点击路径；付费状态以安装时提示为准。

Redlines丨设计标注

作者 Danny Keane。觅件标免费。

详情写明：快速测量并标注选中对象尺寸；多种描边与线条样式；可自定义颜色、间距、字号；支持 PX、%、DP 等单位；可同时处理单个或多个图层；生成的标注会自动分组。

适合：交付文档要「看得见的规格线」、需要单位或样式统一的团队。

不适合：对方已在 Dev Mode 里 Inspect——重复画一套红线反而要维护两份。

Spaciiing丨标注

作者 Chengyi。觅件标免费（详情写明：免费版有每日使用次数限制，Pro 可解除限制并移除品牌标识——以安装时提示为准）。

详情写明：可按 8pt Grid 整理间距、批量画 User Flow 箭头、快速生成尺寸和间距标注；支持保存/导入导出箭头样式；Frame 挪动后可更新箭头位置。

适合：交付标注之外还要画流程箭头、统一 8pt 间距的页面整理。

不适合：只要临时看一下两个图层距离——Option/Alt 即可。

别跟这几件事混了

• 评论（Comments） 是协作讨论，快捷键 C，不是尺寸规格。官方 Inspect 指南把它和测量、注解分开讲。
• 便签类插件（如 Sticky Note）适合评审备注，不是开发用的 Redline。
• 批量改文字 / 换色 / 中文字体 不是标注问题。见 Figma 批量改文字、Figma 批量替换颜色、Figma 中文字体。
• Dev Mode 右侧 Inspect 里看属性、复制代码，和「在画布上画红线」是两条路；能进 Dev Mode 时优先自带 Inspect + Annotation。

在觅件里怎么找

到 觅件 搜「标注」「Redline」「尺寸」「间距」，或从「📌 标注&便签」分类进去。先看中文介绍和是否付费，再决定要不要装。会员可翻页与无限搜索；定价见 定价页（永久 ¥69.9，或按月 ¥19.9，付一次用 30 天，不自动扣款）。

也可用 AI 连觅件 MCP，用中文说「帮我找设计标注、交付 Redline 的插件」。步骤见 MCP 教程。

常见问题

Figma 怎么量两个图层的距离？ 选中一个，按住 Option（Mac）或 Alt（Windows）悬停另一个。任意计划可用，但不能保存分享。

怎么留下别人也能看到的尺寸线？ 用 Measurement（Shift M）拖出可保存测量；付费计划、有编辑权限。或用标注插件把尺寸画成图层。

Annotation 和评论有什么区别？ Annotation 面向开发交付（可钉属性、跟设计更新）；评论是协作讨论线程。

一定要装插件吗？ 不必。自己核对用 Option/Alt；要分享尺寸用 Measurement；要给开发写说明用 Annotation。只有要把 Redline 画进画布、批量出间距，或对方用不了 Dev Mode 时，再上插件。

这些插件会装进当前文件吗？ 不会。觅件是发现工具，点详情后再到社区页由你自己装。

---

• 客服邮箱 hello@zhanghe.dev
• 微信客服