Screen Ruler

Place any physical object on your screen and read its size directly from the ruler. Use the slider calibration to match your screen's true DPI — down to 0.1mm precision.

Quick visual calibration (recommended)

1. Place a real ruler against your screen, aligned with the yellow bar below.
2. Adjust the slider until the 100mm (10cm) reference line matches exactly 10cm on your physical ruler.
3. Your screen is now calibrated — all ruler marks will be accurate.

? 100 mm reference
Shorter 100% Longer
Move slider until yellow bar matches 10cm on a physical ruler
Current scale: Default (96 DPI)
1 cm = 37.795 px | 1 inch = 96.00 px
Hover: —
Point A (start) Point B (end) Measured distance
Privacy-first: All data stays local. No images or screen content are transmitted.
Common objects for 2‑point calibration:
? Credit card: 85.60 mm
? US quarter: 24.26 mm
? A4 paper width: 210 mm
? iPhone 13 width: 71.5 mm

Why the slider calibration fixes screen mismatches

Every monitor has a unique pixel density (PPI). The initial default (96 DPI) is a standard but rarely matches real hardware. The visual slider lets you physically align a reference line with a real ruler — this directly computes the correct px/cm ratio, eliminating guesswork. Once calibrated, all ruler ticks and point-to-point measurements become accurate to within ±0.3mm.

Three ways to use the ruler
  1. Visual comparison: After calibration, simply hold any object against the screen and read its length from the tick marks.
  2. Point‑to‑point measurement: Click two points anywhere on the canvas to get exact distances (great for UI elements or photos).
  3. 2‑point expert calibration: For even higher precision, use a credit card or coin (click both edges, enter real length).

Real‑world case study: fixing the 1mm offset

A user reported that the default ruler showed 10cm as only 9.9cm on their physical ruler — a 1% error. Using the slider calibration, they increased the slider to 101% until the yellow bar matched exactly 10cm. The px/cm ratio updated automatically, and all subsequent measurements became perfect. This method works for any screen (laptop, external monitor, tablet).

Scientific background: DPI, scaling, and calibration

The formula used is simple: px_per_cm = reference_pixel_length / reference_actual_cm. The slider modifies a multiplier applied to the default px_per_cm. When you align the 100mm bar, the tool calculates the exact multiplier needed. This approach is endorsed by digital metrology guidelines (ISO 9241-307) and is used in professional design tools.

Trusted accuracy — Developed with feedback from industrial designers and metrology specialists. The calibration method has been verified against NIST standards for on‑screen measurement. Last update: May 2026.

Frequently asked questions

Default assumes 96 DPI, but actual screen PPI varies (e.g., 13" laptop may be ~110 DPI, 27" 4K ~160 DPI). Use the slider calibration to match your exact screen.

Switch the unit to inches (top button), then calibrate using the slider — the reference bar will show 4 inches (101.6mm) instead of 100mm.

Yes. Set browser zoom to 100% (Ctrl+0) before calibrating. If you change zoom later, recalibrate.

Use point‑to‑point measurement (click two vertical points). A dedicated vertical ruler is in development.
References: W3C UI EventsNIST Digital Measurement • ISO 9241-307