Online ruler
Calibrate once against any bank card and this ruler measures true on your screen. The setting is saved on your device.
How it works
An on-screen ruler is only useful if it is honest about one thing: a browser has no idea how physically large your screen is. The CSS inch is a fixed 96 pixels regardless of whether you are on a 13-inch laptop, a 27-inch monitor or a phone, so a ruler drawn straight from CSS units is wrong on almost every device: usually by 10 to 40 per cent.
This ruler solves that the way a workshop solves it: by calibrating against a known reference. Bank cards are manufactured to ISO/IEC 7810 ID-1, which fixes them at 85.60 × 53.98 mm everywhere in the world. Hold any card against the outline, adjust until the two match, and the page now knows exactly how many pixels your screen puts in a millimetre.
From that single measurement everything else follows: the centimetre and inch scales, the marker readout, and the printed output are all derived from your calibrated pixel density. The value is stored on your device, so you calibrate once and the ruler is correct every time you come back.
Nothing is uploaded, and nothing about your screen is sent anywhere: the calibration lives in your browser’s local storage and can be cleared at any time.
How to use it
- 1 Take any credit, debit or ID card out of your wallet.
- 2 Hold it against the outline on screen and drag the slider until the two match exactly.
- 3 Save the calibration. It is remembered on this device.
- 4 Switch between centimetres and inches and measure against the ruler.
Good to know
- Every bank and ID card is the same size by international standard, which is what makes it a reliable reference.
- Calibration is per device: a laptop and a phone need separate calibration, and each is remembered.
- If you change display scaling or browser zoom, calibrate again, both change how many pixels fill an inch.
- The calibration is stored locally and never leaves your device.
Frequently asked questions
How accurate is an online ruler?
Uncalibrated, not very, the browser assumes 96 pixels per inch, which is wrong on most screens. Once you calibrate against a bank card, the ruler is accurate to roughly the width of a pixel, which is well under a millimetre on any modern display.
Why do I need to calibrate it?
A web page cannot ask your screen how physically big it is. Two laptops with the same resolution can have very different physical sizes, so the only way to draw a true centimetre is to measure against something of known size first.
Why a bank card?
Cards are made to ISO/IEC 7810 ID-1, which fixes every credit, debit and most ID cards at 85.60 by 53.98 millimetres worldwide. It is the one precisely-sized object almost everyone has to hand.
Do I have to calibrate every time?
No. The calibration is saved in your browser on that device. Repeat it only if you change your display scaling, change browser zoom, or move to a different screen.
Can I measure something longer than my screen?
Mark the object at the end of the ruler, slide the object along, and measure again, the same way you would with a short physical ruler. Switching to full screen and rotating to landscape also gains you useful length.
Is my calibration or screen information sent anywhere?
No. The calibration is a single number kept in your browser’s local storage. Nothing is transmitted, and clearing your site data removes it.
Related tools
Your files are processed on your device and are not uploaded. You can verify this in your browser’s developer tools under the Network tab.