Gripper
为设计师打造的开发工具
一款为开发者和设计师设计的强大浏览器扩展。轻松检查元素、拾取颜色、分析排版、截取屏幕截图和导出资源。
强大功能
满足设计检查和开发的一切需求
元素检查器
点击任意元素查看 CSS 属性、尺寸和计算样式等详细信息
颜色拾取器
从页面任意位置拾取颜色，放大预览并自动复制到剪贴板以便使用
截图工具
捕获元素截图，可自定义水印、时间戳和网格叠加选项
排版分析
分析字体、大小、粗细、行高和字间距等全面的详细信息
盒模型查看器
通过交互式显示和测量可视化外边距、边框、内边距和内容
资源导出
一键直接导出图片、SVG 和其他资源以快速下载
元素搜索
通过标签、类或 ID 搜索元素，支持键盘导航以快速访问
侧边栏
在浏览器侧边栏中查看有组织的详细元素信息
键盘快捷键
使用直观的快捷键提高生产力，快速访问所有操作
深色/浅色主题
系统偏好检测并支持手动切换，获得舒适的查看体验
国际化
完全支持英语和中文（简体），可轻松切换语言
独立标签页状态
每个浏览器标签页的扩展状态独立，更好地管理工作流程
键盘快捷键
使用直观的键盘快捷键提高工作效率
切换检查器模式V
颜色拾取器（滴管）I
元素搜索F
切换侧边栏S
检查所有元素A
选择父元素↑
选择子元素↓
暂停/继续P
关闭扩展Esc
安装
几秒钟即可开始使用 Gripper
手动安装
克隆仓库
git clone https://github.com/isboyjc/gripper.git安装依赖
pnpm install构建扩展
pnpm build:chrome