▮ Device Testers

Device test · Measurement

Screen Ruler

Measure small objects straight off your display, in centimeters or inches. Calibrate once with any bank card so the scale matches the real world. The calibration is one number stored on your device — nothing is uploaded.

PPI96 (assumed) px/cm37.8 Display— Unitcm Calibrationassumed 96 DPI

Calibrate with a bank card

Hold any standard bank card flat against the outline below — every debit, credit, and ID card is exactly 85.60 mm wide (ISO/IEC 7810 ID-1). Drag the slider until the outline is precisely as wide as the card, then apply.

How this test works

The ruler on this page is driven by a single number: pixels per millimeter. Out of the box it uses the web's standard assumption — 96 CSS pixels per inch, about 3.78 pixels per millimeter — and the readout strip reports that figure as assumed rather than measured. Every tick mark on the canvas is positioned by multiplying that number: one tick per millimeter in centimeter mode, one per sixteenth of an inch in inch mode, with longer marks and printed numerals at the majors.

Calibration replaces the assumption with a measurement of your actual screen. A bank card is a precision reference most people already carry: the ISO/IEC 7810 ID-1 standard fixes it at exactly 85.60 mm wide, whichever bank issued it. When you drag the slider until the on-screen outline matches your card, the page divides the outline's width in pixels by 85.6 to get your display's true pixels-per-millimeter, redraws the ruler at that scale (accounting for devicePixelRatio so ticks stay sharp), and saves the one resulting number in your browser's local storage — nothing else, and nowhere else.

The method has real limits. Browser zoom and operating-system display scaling both change how many physical pixels a CSS pixel occupies, so a calibration is only valid at the zoom level where it was made — recalibrate after changing either. Physical resolution caps precision: a typical desktop pixel is a quarter to a third of a millimeter, so expect accuracy within about a millimeter over the card's width, not micrometer readings. And the ruler measures along the flat plane of the screen — TVs and projectors that overscan or stretch the image, and strongly curved displays, will disagree with a tape measure no matter how carefully you calibrate.

Frequently asked questions

Why does an on-screen ruler need calibration?
Web pages measure in CSS pixels, which are an abstract unit — the browser maps them to physical pixels through the operating system's scale factor, and assumes 96 CSS pixels per inch. On modern laptops and phones with display scaling of 125%, 150%, or more, that assumption is almost never physically true. Calibrating against an object of known size, like a bank card, replaces the assumption with the real pixels-per-millimeter of your particular screen.
How accurate is it after calibrating with a bank card?
Quite accurate — typically within about a millimeter across the width of the card. Every ID-1 bank card is exactly 85.60 mm wide by international standard, which makes it an excellent free reference. Use a rigid plastic card rather than a bent or flexible one, hold it flat against the screen, and take a moment to match the outline edges carefully; the closer the match, the better every measurement afterwards.
Does browser zoom break the calibration?
Yes. Zoom changes how many physical pixels one CSS pixel occupies, so a calibration done at one zoom level is wrong at any other. Calibrate and measure at the same zoom level — ideally 100%, which you can restore with Ctrl+0 (Cmd+0 on a Mac). The same applies to the operating system's display scaling: change it, and you should recalibrate.
Is my calibration data uploaded or shared?
No. Calibration produces a single number — pixels per millimeter — which is saved in your browser's local storage on this device so the ruler stays accurate on your next visit. Nothing is sent to a server, there is no account, and pressing Reset deletes the stored value immediately.
Why does the ruler disagree with my physical ruler?
The usual causes: the browser zoom or system display scaling changed after you calibrated (recalibrate to fix it), you are on a TV or projector that overscans or stretches the image, or you are reading beyond the precision the screen can offer — a pixel is roughly a quarter to a third of a millimeter, so sub-millimeter readings are at the edge of what any screen ruler can resolve.

Related tools