About Online Ruler
How the screen ruler works, and what affects accuracy
Online Ruler is a browser-based screen ruler. You can measure in pixels (px) and, after PPI calibration, estimate centimeters or inches at a closer 1:1 scale. Guides and the Selection tool help align and read sizes, but results still depend on zoom, display scaling, and hardware.
Purpose
Make on-screen measuring straightforward: show reliable px sizes, and provide calibration to approximate real-world units with clear limitations.
Principles
Prefer clarity over claims. Explain what calibration changes, keep the interface simple, and keep settings on your device.
Team
Built and maintained by developers who use it for UI layout checks, print-on-screen references, and quick px measurements.
Technology
Built with Next.js, React, Tailwind CSS, and next-intl. The ruler runs in the browser; calibration and preferences are stored locally.
How the measurement works
The ruler reads distances in CSS pixels—the coordinate system a web page uses. Pixel mode works without calibration. For cm, mm, or inches, the tool converts CSS pixels using an effective PPI value. Matching a real card, sheet of paper, or known length gives a better value for the browser and display you are actually using than copying the hardware PPI from a specification sheet.
What it is good for
Quick checks of web layouts, image dimensions, labels, cards, and other small objects that can be placed safely near a screen. It is also useful when you need a temporary estimate and do not have a physical ruler nearby.
What it is not for
This is not a certified instrument. Screen zoom, operating-system scaling, monitor changes, and viewing conditions can introduce error. Do not rely on it for medical, manufacturing, construction, legal, or safety-critical measurements.
What stays on your device
Ruler coordinates, selection dimensions, the reference you choose, and your calibrated PPI are handled in your browser. The site does load Umami, Google Analytics, and Google AdSense on every page for traffic statistics, site improvement, verification, and advertising. Those services may process normal visit and device data, but our application code does not intentionally send your measurements to them.
Definitions and reference sizes
The explanation of CSS pixels follows the W3C CSS Values and Units specification. The 85.60 mm card width used by the calibration tool is the ID-1 format defined by ISO/IEC 7810. A4 and US Letter dimensions use their standard paper sizes.