Guide · Measurement
The Bank Card Is a Precision Instrument
Every payment card on earth is the same size — not by habit but by international standard, and to hundredths of a millimeter. That accident of interoperability puts a precision reference object in nearly every pocket, which is exactly what an on-screen ruler needs to become trustworthy.
The ruler starts from the web's 96-DPI assumption and says so in its readout. Thirty seconds with any card in your wallet replaces that assumption with a measurement of your actual screen — one number, stored on your device, nothing uploaded.
Why every card on earth is the same size
Pull any debit or credit card out of your wallet and it measures 85.60 mm by 53.98 mm, with rounded corners — and most gift cards and hotel key cards copy the same footprint by convention. That is the ID-1 format defined by ISO/IEC 7810, the international standard for identification cards, and it is not a suggestion. A card punched out in one country has to slide into an ATM slot built in another, seat correctly in a point-of-sale reader designed a decade earlier, and stack neatly in wallet pockets sewn by people who never saw the card. None of that works unless every manufacturer cuts to the same dimensions, so every manufacturer does.
The delightful consequence is that a strictly controlled reference object gets handed out free, in enormous volume, to almost everyone. You could buy a machinist's gauge block to calibrate a measurement against — or you could use the card that came with your checking account, whose width is fixed by the same kind of document.
What a reference fixes on a screen
Web pages measure in CSS pixels, and a CSS pixel is an abstraction, not a physical size. Browsers assume 96 CSS pixels per inch — about 3.78 per millimeter — and then the operating system's display scaling stretches that assumption by 125%, 150%, or whatever your settings say. The physical distance covered by "100 pixels" is therefore different on your laptop, your phone, and your monitor, and no web page can know which situation it is in from first principles. That is why the Screen Ruler boots up labeling its own scale assumed: honest instruments report their state.
Calibration replaces the assumption with arithmetic. You hold a card flat against the screen and drag a slider until the on-screen outline is exactly as wide as the card. At that moment the page knows two things about the same distance: its width in pixels (whatever the slider reads) and its width in millimeters (85.60, guaranteed by the standard). Divide one by the other and you have your display's true pixels-per-millimeter — match the outline at 340 pixels, for instance, and the scale becomes 3.97 px/mm. Every tick mark on the ruler is then redrawn from that single measured number, and the readout switches from assumed to calibrated. The whole method stands on the card being the size it claims to be, which is precisely what the standard guarantees.
Craft: getting a clean match
The card is precise; the alignment is up to you. A few habits close most of the gap.
Rigid beats flexible. Use a stiff plastic card, not one that has spent years bowing to the shape of a back pocket. A bent card held to a flat screen presents a foreshortened width, and the calibration inherits the error. If your straightest card is still slightly curved, press it flat against the glass while you match.
Align to the card body, not the printing. The standard fixes the dimensions of the card blank — the physical rectangle. Artwork, logos, and embossed numbers can sit off-center on that blank, so match the outline to the card's actual edges and ignore everything printed between them.
Look straight on. The card rests on the surface of the glass while the pixels glow a small distance beneath it. View the match from an angle and that separation shifts the apparent alignment — the same parallax that makes a speedometer needle read differently from the passenger seat. Line up your eye perpendicular to the screen.
Calibrate at the zoom you use. Browser zoom changes how many physical pixels one CSS pixel spans, so a calibration made at one zoom level is wrong at every other. Match at your normal viewing zoom — ideally 100% — and recalibrate whenever you change zoom or the operating system's display scaling. It takes under a minute.
The rest of the drawer, honestly tiered
The card is not the only standardized object within reach, and it is worth knowing what the alternatives are actually good for.
Paper is good. A sheet of A4 is 210 mm wide, US Letter is 8.5 inches (215.9 mm), and paper mills cut to those sizes accurately with clean, straight edges. The drawbacks are practical: paper flexes, curls, and is far wider than a card, so it is awkward to hold flat against a vertical screen for a fine match. Where paper shines is as a cross-check — after calibrating with a card, lay a sheet against the ruler and confirm it reads 210 or 215.9 mm across. Two independent references agreeing is real evidence.
Coins are precise but small. A US quarter is 24.26 mm across; a 1 euro coin is 23.25 mm. Mints hold those diameters tightly, so the reference itself is excellent. The problem is proportion: the same half-millimeter of alignment slop is about 2% of a quarter's diameter but only about 0.6% of a card's width. A small reference turns your fixed hand-and-eye error into a larger relative error, and the calibration scales that error into every measurement afterward.
This is why the card wins. It is rigid, it is long enough that your alignment error is a small fraction of the reference length, and — the unbeatable part — essentially everyone already has one.
What not to trust
A few references feel plausible and are not. The remembered ones first: "my thumb is about an inch," "this knuckle is two centimeters." Body dimensions vary from person to person and your memory of them drifts; they are fine for guessing lumber, not for calibrating an instrument. Soft tape measures are nearly as bad against glass — they bow away from the surface, cloth ones stretch, and their end fittings are built for hooking over a board edge, not butting flush against a flat pane.
The subtlest bad reference is a stale calibration. Change the browser zoom or the system's display scaling and every previous match is silently invalid — the screen did not move, but the mapping between CSS pixels and glass did. The ruler's readout is the tell: if the calibration field has fallen back to assumed, or you know settings changed since you last matched, redo the match before trusting a reading. The habit that keeps it honest costs thirty seconds: card on glass, match the outline, measure, and — when it matters — sanity-check against a sheet of paper. Everything else is guessing with extra steps.