GridSim

GridSim 是一款轻量级的网页网格检查工具，让你在任何实时网页上叠加列网格和基线网格，直观地查看元素对齐情况。无需安装复杂插件，只需将书签工具拖拽到浏览器书签栏，点击即可在任意页面激活网格覆盖，并实时调整列宽和间距。

核心功能

实时网格叠加：在任意网页上显示列网格（X轴）和基线网格（Y轴），帮助设计师和开发者快速识别布局中的对齐问题。

书签工具一键启动：支持 Safari 和 Chrome 浏览器，将书签工具添加到书签栏后，点击即可在页面顶部显示网格控制面板，无需刷新页面。

灵活的控制选项：可实时调整列数、列宽和间距，并支持切换基线网格的显示，满足不同设计稿的检查需求。

主要特性

• 无需注册，完全免费：直接使用，无需创建账号或付费。
• 多设备预览：输入 URL 即可在真实的 iPhone 或 Android 设备框架中预览页面，并支持双设备对比。
• Figma 集成：可将网格导出为 Figma 覆盖层，或直接复制 CSS 代码，方便设计稿与开发对齐。
• 轻量高效：基于书签工具，不占用系统资源，即点即用。

适用场景

• 前端开发者：快速验证页面元素是否严格对齐网格系统。
• UI/UX 设计师：在真实网页上检查设计还原度，并与 Figma 设计稿对比。
• QA 测试人员：高效检测跨设备、跨浏览器的布局一致性。