在网页上叠加设计模型以进行像素完美的实施验证
★ 适合以下开发者：
• 使用 Figma 设计或 PDF 模型
• 需要验证像素完美的实施
• 想要快速比较设计与现实
• 跨多个断点构建响应式网站
★ 主要特点：
📸 双上传模式
- 手动上传：将任何图像分配到任何断点并完全控制
- 批量上传：按尺寸自动检测并映射多个图像
📱 智能响应检测
当您调整浏览器大小时自动切换设计：
• 移动设备：390 像素
• 平板电脑：768 像素
• 桌面介质：1280px
• 桌面大：1440px
• 桌面XL：1600px
🎯 精密控制
- 不透明度滑块（0-100%）将设计与实施融为一体
- 箭头键微移：1 像素精度或 Shift 10 像素
- 点击覆盖 - 永远不会阻止页面交互
- 用于即时切换和不透明度控制的键盘快捷键
💾 持久状态
您的所有设置、图像和位置都会自动保存。从上次中断的地方继续工作。
★ 工作原理：
1. 从 Figma 或 PDF 导出您的设计模型
2.上传图片（批量自动检测或手动分配）
3. 导航至您的网页
4.启用叠加并调整不透明度
5. 使用方向键微调对齐方式
6. 比较并完善您的实施
★ 适合：
- 前端开发人员检查设计准确性
- QA 团队验证响应式布局
- 设计交接验证
- 客户介绍和批准
- 像素完美的实施验证
★ 智能自动检测：
批量上传会自动处理 DPI 缩放。导出 150 DPI PDF，扩展程序会智能地将它们映射到正确的断点。
★ 键盘快捷键：
在 chrome://extensions/shortcuts 配置自定义快捷方式：
- 打开/关闭叠加
- 增加/减少不透明度 10%
- 加上方向键以实现精确定位
没有账户。没有订阅。没有跟踪。只是一个简单而强大的工具，可以帮助您构建更好的网站。
非常适合关心设计质量的机构、自由职业者和团队。
