Privacy notice
Every measurement runs entirely inside your browser using the Canvas API. Your images are never uploaded, stored, or shared — they stay on your device.
📏 Developer & Design
Pixel-Perfect Screen Ruler
Measure anything down to the pixel. Drag a ruler across the screen with guides, or upload/paste an image and measure exact distance, angle, and area — with optional real-world calibration to mm, cm, or inches.
Drag the ruler to position it and resize with the square handles. Add draggable guides to align elements, and watch live coordinates as you hover.
ℹ️ For browser security, a web ruler can only measure inside this page. To measure another app, window, or screen, use the Measure image tab and either Capture screen or paste a screenshot.
340 × 66 px
Drag & drop, paste, or browse an image
Want to measure another app or screen? Click Capture screen above, pick the window, and measure the captured frame here. Everything stays on your device — nothing is uploaded.
No calibration — results shown in pixels. Measure a known length with the Distance tool, then set it as reference.
Distance, angle & area
Three measurement tools in one: straight-line distance, three-point angles, and rectangular area with width, height and perimeter.
Real-world calibration
Set a known length once and every measurement converts to mm, cm, inches, or metres automatically.
Zoom, pan & color pick
Zoom in for pixel-precise clicks, scroll to pan, and read the exact color under your cursor.
100% private
Images are processed locally with the Canvas API. Nothing is ever uploaded to a server.
How it works
The on-screen ruler tracks pixel width and height as you drag and resize it. For images, each click sets a point in the image's native coordinate space, so distance, angle, and area stay accurate at any zoom level. Calibration maps pixels to real units using a reference length you provide.
Everything this ruler can do
On-screen ruler
- Draggable, resizable ruler with fine and major tick marks.
- Switch between horizontal and vertical orientation.
- Add unlimited draggable horizontal and vertical guides.
- Live cursor coordinates and one-click reset.
Image measurement
- Upload, drag & drop, or paste an image from the clipboard.
- Measure distance (2 points), angle (3 points), and area (rectangle).
- Keep multiple color-coded measurements in a list and delete any of them.
- Zoom, pan, sample pixel colors, calibrate units, and export to CSV.
Frequently asked questions
How do I measure distance on an image?
Open the "Measure image" tab, upload or paste an image, keep the Distance tool selected, then click a start point and an end point. The distance appears instantly in pixels (and real units once calibrated).
How do I convert pixels to mm, cm, or inches?
Measure a length you already know with the Distance tool, type that length and pick its unit in the calibration box, then press "Set from last distance". Every measurement then shows both pixels and real units.
Can I measure angles and areas?
Yes. The Angle tool measures the angle between three points (the middle click is the vertex). The Area tool draws a rectangle and reports its width, height, area, and perimeter.
Can I paste a screenshot directly?
Yes. Copy any image or take a screenshot, then press Ctrl+V (Cmd+V on Mac) while on the Measure image tab and it loads instantly.
Are my images uploaded anywhere?
No. All processing is local to your browser, so your images never leave your device.
Does the on-screen ruler measure real screen pixels?
It measures CSS pixels within the page. On high-DPI displays one CSS pixel can map to several physical pixels, so use image calibration when you need exact real-world sizing.
Free online screen ruler and image measurement tool
The Pixel-Perfect Screen Ruler by ToolAdda is a fast, private way to measure distances, angles, and areas right in your browser — no account, no install, and no uploads. Designers use it to check spacing and alignment, developers use it to verify pixel-perfect layouts, and anyone can use it to measure real-world objects in a photo after a quick calibration.
How to use
- Pick a mode: drag the on-screen ruler, or upload/paste an image to measure.
- Choose a tool — Distance, Angle, or Area — and click the points you want to measure.
- Optionally set a known distance to convert every measurement into real-world units.
Benefits
- Pixel-accurate and completely private.
- Perfect for designers, developers, and QA teams.
- Works smoothly on desktop and mobile browsers.