1. The browser gives us CSS pixels
Web pages are laid out using CSS pixels. A CSS pixel is a logical coordinate used by the browser; it is not a guarantee that one CSS pixel is one physical pixel on the panel. Devices can have different physical pixel densities and operating systems can apply display scaling.
For that reason, a web application can reliably know the size of an element in CSS pixels, but it cannot universally infer the exact physical width of every display from browser information alone.
2. One scale controls the physical ruler
Online Ruler uses a single value, cssPxPerMm, as the core conversion. Once that value is selected, the relationships are deterministic:
The ruler ticks, guide positions and unit readouts should all derive from this same value. That avoids a common software error: using one scale for the visual ruler and another scale for the displayed number.
3. Automatic detection is an estimate
The application can use browser-reported screen dimensions, device pixel ratio, device hints and display profiles to produce a best-effort estimate. That is useful for getting close without manual setup, but it is still an estimate because the browser does not expose a universal, authoritative measurement of the physical active panel.
This is why a well-designed screen ruler should not claim that every device is automatically perfectly accurate. A physical reference remains the stronger source of truth for physical measurement.
4. Calibration closes the gap
Calibration compares the displayed measurement with a known physical length. Suppose the ruler displays 12 mm while a physical reference is 10 mm. The correction factor is:
The active scale can then be corrected by that factor. A second verification point can be useful for checking that the error is a scale problem rather than a positional or alignment problem.
5. What happens when the display environment changes?
A stored physical calibration is only trustworthy when the display context has not meaningfully changed. Changing browser zoom, switching display characteristics, changing device pixel ratio, or rotating a device can alter the runtime environment. Online Ruler therefore fingerprints the display context and can fall back to a fresh estimate when it changes.
That behavior is intentional: it is better to show an estimate and ask for verification than to silently apply an old physical calibration to a new environment.
Want the practical procedure?
Use the screen calibration guide for a repeatable setup, then use the accuracy guide to understand what the result does and does not prove.