🖱️ 鼠标光标追踪器
免费在线鼠标光标位置追踪工具,实时显示鼠标指针在页面上的坐标位置。同时显示屏幕分辨率和浏览器视口尺寸,以及鼠标当前位置的RGB颜色值。适合前端开发者调试CSS定位、设计人员测量元素间距、演讲演示时展示鼠标位置。
⚙️ 实时追踪
移动鼠标到下方区域查看实时坐标。页面中移动鼠标也可查看信息板数据。
鼠标 X 坐标
0
像素 (px)
鼠标 Y 坐标
0
像素 (px)
屏幕分辨率
0x0
宽 x 高
视口尺寸
0x0
宽 x 高
页面偏移 X
0
包括滚动
页面偏移 Y
0
包括滚动
设备像素比
1
DPR
当前位置颜色
🎨
rgb(0,0,0)
X: 0, Y: 0
提示:按 F11 全屏模式体验更好。在页面上任意位置移动鼠标都可查看实时坐标。
❓ 常见问题
适用于前端开发调试:检查CSS定位和布局坐标、测量元素之间的像素间距、测试响应式设计在不同视口下的表现、演示或教学时展示鼠标运动轨迹。同时也适合设计师确认设计稿中的精确像素位置。
工具在追踪区域叠加了一个Canvas,当鼠标移动时从Canvas中读取鼠标位置像素的RGB值。这读取的是追踪区域背景的颜色,并不是屏幕其他区域或外部应用的颜色。建议在背景区域移动以获取准确的采样颜色。
clientX/clientY是相对于浏览器视口(可见区域)的坐标,而pageX/pageY是相对于整个页面的坐标,包括了滚动的偏移量。当页面有滚动时,pageY会比clientY大,差值等于已滚动的像素数。