Ruler Grid
MDesign · Firefox
终极网页设计工具套件！精准标尺、取色器、字体扫描器和实时页面编辑功能集于一体的强大工具。可测量距离、选择颜色，并实时调整任意布局。更快打造像素级完美网站。开发与设计必备工具。
<all_urls>），意味着它可以读取你在任意站点的页面内容，包括已登录的页面。这是许多扩展正常工作的必要条件，但也值得你确认来源可信。
截图
简介
Ruler Grid —— 一款面向设计师和前端开发者的通用工具套件。Ruler Grid 帮助你分析并优化任何网站的页面布局。你可以直接在浏览器中测量元素、检查样式、选取颜色并进行设计实验。
核心功能：
• 标尺与参考线
使用水平和垂直参考线，高精度测量距离并对齐元素。
• 取色器工具
从页面中获取任意颜色或渐变，并以 HEX、RGB 或 HSL 格式复制。
• 字体检查器
即时识别字体、字号、字重以及行高等排版信息。
• 实时页面编辑
无需打开 DevTools，直接在网页上修改文本、间距和布局。
• CSS 与样式检查器
一键查看计算样式、CSS 属性以及 Tailwind 类名。
• 响应式网格
叠加布局网格，检查不同屏幕尺寸下的列结构、间距与对齐情况。
为什么选择 Ruler Grid？
快速、轻量且直观——Ruler Grid 提供你分析网页布局所需的一切工具，让工作流程更高效，无需离开当前页面。
Ruler Grid 是做什么的
Ruler Grid 是一款面向 Firefox 的开发者工具类扩展，主要用来调试页面、查看样式与请求、测试接口、辅助前端开发。官方对它的介绍是：终极网页设计工具套件！精准标尺、取色器、字体扫描器和实时页面编辑功能集于一体的强大工具。可测量距离、选择颜色，并实时调整任意布局。更快打造像素级完美网站。开发与设计必备工具。在Firefox 附加组件商店（AMO）上，它当前版本 1.3.0，约 45 名用户。
适合什么人用
从功能定位看，Ruler Grid 更适合前端工程师、测试与需要经常查看页面结构的用户。如果你平时只是偶尔遇到相关需求，用浏览器自带功能也能凑合；但如果这件事每天都发生，装一个专门处理它的扩展通常比手动操作省事得多。需要注意的是它作用于所有网站，装上后建议先观察一两天，确认不影响常用站点的正常使用。
怎么安装 Ruler Grid
- 打开Firefox 附加组件商店（AMO）上的官方页面；
- 点「添加到浏览器」并确认权限提示；
- 装好后在扩展列表里固定图标，方便随时开关。
本站只做索引与介绍，安装包来自官方商店。如果商店页面提示当前地区不可用，说明该扩展未在你所在区域上架。
常见问题
Ruler Grid 是免费的吗？
Ruler Grid 在Firefox 附加组件商店（AMO）免费提供下载。它是浏览器扩展，装上就能直接用，不需要注册账号。
Ruler Grid 安全吗？
它只申请了 0 项权限，范围比较克制，没有申请「读取所有网站数据」这种大权限。
Ruler Grid 支持哪些浏览器？
当前收录的版本来自Firefox 附加组件商店（AMO），适用于 Firefox。同一个扩展在其他商店可能有对应版本，但功能与版本号不一定相同。
怎么卸载 Ruler Grid？
在扩展管理页找到 Ruler Grid，点移除即可。它在本地保存的设置会一起清掉，不会残留数据。
权限清单 来自 manifest.json 原文
站点访问 1
<all_urls>
接口权限 7
activeTabcontextMenusdeclarativeNetRequestdownloadsscriptingstoragetabs