Online Ruler — Centimetres

A 30 cm on-screen ruler, marked down to the millimetre, for measuring something quickly without getting up to find a physical one — a parcel, a screen, a piece of furniture, a gap you need a rough number for right now.

Why it has to be calibrated first

CSS and the web platform generally assume a fixed 96 pixels per inch, but real screens vary enormously in actual pixel density — a 4K laptop panel can pack more than double that into the same physical inch. Without calibration, a ruler drawn at the CSS-assumed scale would show a centimetre at roughly half its true size on a high-density screen, and larger than true size on a low-density one.

Every bank card is manufactured to a fixed, internationally standardised width of 85.6 mm, which makes it a reliable, always-available reference object. Holding one against the calibration strip and adjusting the pixels-per-inch value until they match tells the ruler exactly how many of your screen's actual pixels correspond to a real centimetre — after that, the markings are accurate for that screen at that zoom level.

Keeping it accurate

Browser zoom has to stay at 100% after calibrating, since zooming in or out changes the effective pixel scale and throws off the calibration you just did. Recalibrate any time you switch screens, change your OS display scaling, or notice the ruler looks off.