Online ruler · a digital ruler calibrated against a card you already own
An online ruler that is actual size — and says how wrong it might be
Below is a working digital ruler. Until you match the outline to a bank card it is drawn from the CSS specification's assumption that an inch is 96 pixels, which is wrong on almost every display, and the readout says so in those words. One twenty-second match replaces the assumption with a measurement of your own screen, and every reading after that carries the error band it actually earned.
UNCALIBRATED — assumed 96 CSS ppi
This is not actual size yet. Match a bank card to make it so.
Half-millimeter marks are not drawn on this display — they would land 1.9 device pixels apart, and below 3 they blur into a gray band instead of reading as marks. This screen would need 153 ppi.
Match the outline to a bank card
Hold any bank card, ID card or driving license against the screen, along the outline below, and drag the slider until the two edges line up. Every one of those cards is the same object to the standard that governs it: 85.60 by 53.98 mm nominal, and the tolerance on that is where the ruler's error band comes from. A card and an A4 sheet are the two objects this site offers, and the calibration walkthrough and reference table says which others were checked and why they are withheld.
Two ways to hold it, and the choice is worth a third of the error band. Laid flat across the screen the long edge needs 85.60 mm of width, which a phone in portrait does not have — an iPhone 15 is about 64 mm of glass, a Pro Max about 71, an SE about 58. Stood upright against the same phone the full long edge fits down the screen instead, so the reference stays 85.60 mm and the band stays ±1.2% rather than widening to the short edge's ±1.7%. On a tall screen this page starts you on the upright mode for that reason and says so under the ruler; carries the geometry in full.
A stated screen size moves the outline near where it probably belongs, so there is less dragging to do. It is not a calibration and never turns anything green: it assumes the pixel count your browser reports is the panel's own, which is false under macOS scaled resolutions, false in Safari under page zoom, and false wherever a privacy mode is rewriting those numbers. Once you have matched a card it also prints the two figures side by side, which is a sanity check and nothing more.
The readout turns green for one thing only: a reference match you completed. A stored calibration whose display has since changed, one old enough to be worth re-checking, one that failed its own checks on the way back in, and a live pinch-zoom are all reported in neutral, because none of them is a measurement.
Check it against a second object
One measurement is a measurement. Two independent measurements that agree are evidence, and this is the only thing on the site that earns the word verified. Take a sheet of A4, match its outline the same way, and the page prints how far apart the two answers are as a percentage of their mean. Inside 1% the readout says cross-checked. Outside it, the number is printed and the card measurement stands unchanged.
Paper is a second opinion here and never the calibration itself, and the tool refuses it as one rather than warning about it. A sheet bows away from a vertical screen, and that bias is systematic — it is not inside the ±1.0% the long edge earns, which covers only ISO 216's ±2 mm and your alignment. What paper has instead is length: 297 mm against a card's 85.60, so your hand's slop is a much smaller share of it.
NOTHING TO CHECK YET — calibrate against a card first
What a disagreement above 1% means, stated because the arithmetic says something a tighter-sounding sentence would not: a card at ±1.2% and an A4 long edge at ±1.0% can legitimately differ by ±2.1% with both readings correct and inside their own bands, against a 1% gate. So above 1% the second object has not confirmed the first. It has not shown it wrong either, and this page will not say that it has. Re-matching the card starts again from one measurement, because the sheet agreed with a number that no longer exists.
Marks this ruler will not draw
A printed graduation is a claim that the distance between two marks is what the label says, and on a raster display that claim needs the marks to survive as marks. One pixel of line and two of clear gap is the floor — at a two-pixel pitch a comb aliases into flat gray and there is nothing left to count — so a graduation needs three device pixels of pitch before it is drawn at all. Half-millimeter marks need 6.0 device pixels per millimeter, which is 152.4 pixels per inch, and the two commonest desktop monitors in the world are below it:
| Display | Device px per mm | 1 mm marks | ½ mm marks |
|---|---|---|---|
| 24-inch 1920×1080 | 3.61 | yes | no |
| 27-inch 2560×1440 | 4.28 | yes | no |
| 13.3-inch 1080p at 100% | 6.54 | yes | yes |
| 14-inch laptop retina panel | 10.00 | yes | yes |
| Recent flagship phone | 18.11 | yes | yes |
| 55-inch 1080p television | 1.57 | no | no |
So on those screens the level is dropped, and the note under the ruler above says which level went and what density the screen would have needed to keep it. Competitors draw the marks anyway. The difference is not visible in a screenshot, which is exactly why it is written down.
The tools on this site
-
On the screen
Screen rulerA different job — measuring an image or an interface element on the glass rather than an object held against it, in CSS pixels, with what a CSS pixel is and is not.
-
On paper
Printable rulerA ruler drawn in true millimeters for the sheet in your printer, with a card outline and a 100 mm bar printed beside it so you can check the printer did not scale it.
-
Method and evidence
Calibration, step by stepThe full walkthrough, the two reference objects that are offered, the ones that are withheld with the reasons recorded, and the published source behind every dimension.
What is measured, how it is kept, and what it cannot tell you
What is measured. A browser cannot ask the display how large it is. It reports CSS pixels, and the CSS specification defines an inch as exactly 96 of them whatever the panel actually is — so a ruler drawn straight from that number is correct only by coincidence. The one measurement that fixes this comes from you: hold an object of known size against the glass, match the rendered outline to it, and the ratio between the object's real millimeters and the outline's pixels is this display's scale. Marks are then drawn at their exact fractional pixel positions and never snapped to the pixel grid, because snapping moves a mark by up to half a pixel — 0.13 mm on a typical monitor, which over a 10 mm reading would be a larger error than the band this page prints.
How it is kept. What gets stored is device pixels per millimeter, not CSS pixels per millimeter. Page zoom moves the browser's pixel ratio on Chrome, Edge and Firefox, and so does an operating-system display-scaling change on Windows and on GNOME; dividing by the current ratio returns the original figure, so the calibration survives those — measured across four display scales, 100 mm rendered at the same device-pixel width every time. Two cases are caught rather than corrected: Safari does not report page zoom through the pixel ratio, and a macOS scaled resolution moves the reported pixel count instead. Both leave green and ask for another twenty seconds, which is what the witnesses are for: alongside the density the page records what the display was reporting — pixel ratio, native pixel count, browser chrome, layout scale — and compares them on every visit and on a timer, because a pixel-ratio change can fire no events at all. There is one record and every ruler here that needs a calibration reads it, so a card matched here is a card matched on the millimeter ruler, the inch ruler, the actual-size ruler and the phone page — it does not travel to another browser, another device or another site, because browser storage is kept per site and per browser and nothing here is sent anywhere.
What it cannot tell you. Two limits, stated because they are real. First, no ruler in a browser can detect a change to a different monitor of the same resolution: moving a 1080p profile from a 24-inch panel to a 32-inch one is a third wrong with every signal on the page identical. Casting, mirroring, screen magnifiers and a same-profile move to another machine are undetectable for the same reason, which is why the calibration is re-checked when the display reports anything new and re-offered after a long gap. Second, the error band bounds the object's dimensional spread and your alignment. It does not model holding the card off the glass at an angle, screen curvature, or paper flexing against a vertical panel — those are handled by which objects are offered at all, not by inflating a number until it means something other than what it says.
What an uncalibrated inch actually measures
CSS defines an inch as exactly 96 pixels and a millimeter as 96/25.4 pixels, and no shipping browser resolves those units against the real geometry of the display, because no browser is told what that geometry is. The frequently repeated claim that physical units "become real" on high-density devices is an artefact of how the specification describes its anchor unit, not a behavior anything implements. So an uncalibrated on-screen ruler is not a ruler with a small error; it is a ruler whose error is whatever the gap happens to be between your panel and 96 pixels per inch.
| Display | Panel density | Pixel ratio | CSS px per real inch | A CSS inch renders as |
|---|---|---|---|---|
| 24-inch 1920×1080 | 91.8 ppi | 1 | 91.8 | 1.046 in (+4.6%) |
| 27-inch 2560×1440 | 108.8 ppi | 1 | 108.8 | 0.88 in (−12%) |
| MacBook Pro 14-inch, default scaling | 254 ppi | 2 | 127 | 0.76 in (−24%) |
| 13.3-inch 1920×1080 at 100% | 166 ppi | 1 | 166 | 0.58 in (−42%) |
| iPhone 15 | 460 ppi | 3 | 153 | 0.63 in (−37%) |
| Pixel 7 | 416 ppi | 2.625 | 158.5 | 0.61 in (−39%) |
| 15.6-inch 4K at 100% | 282 ppi | 1 | 282 | 0.34 in (−66%) |
Across the seven displays listed on this page, from 66 percent short to 5 percent long, and typically 25 to 40 percent short on a modern one. The spread comes from the CSS specification fixing an inch at 96 pixels whatever the panel is: a 24-inch 1080p monitor puts 91.8 pixels in a real inch, so the CSS inch overshoots, while a 15.6-inch 4K laptop at 100 percent scaling puts 282 in one and the same CSS inch renders about a third of the length.
Two things follow, and both of them are why this page is built the way it is. The errors are large enough to matter for anything anyone would actually use a ruler for — a ring, a bolt, a picture frame — and they are not in a consistent direction, so no fudge factor rescues them. And they are invisible: an uncalibrated ruler drawn at 96 pixels per inch looks exactly like a calibrated one, which is why the state of the calibration is printed beside every reading on this site instead of being inferred from how finished the page looks.
None of this applies to measuring something that is itself on the glass — an image, a button, a gap in a layout. That is a layout distance rather than a physical one, it is exact in CSS pixels without any calibration at all, and it has its own instrument.
Inch fraction chart — every sixteenth of an inch, in decimals and millimeters
Exact values, not rounded ones. The inch has been defined as exactly 25.4 mm since the international yard and pound agreement of 1959, so every row here is arithmetic with no uncertainty in it at all. That is worth saying plainly on a site about measurement error: the conversion is exact and the reading is not, and any error you end up with came from the ruler and the eye rather than from this table.
| Fraction | Decimal inch | Millimeters |
|---|---|---|
| 1/32 | 0.03125 | 0.79375 |
| 1/16 | 0.0625 | 1.5875 |
| 1/8 | 0.125 | 3.175 |
| 3/16 | 0.1875 | 4.7625 |
| 1/4 | 0.25 | 6.35 |
| 5/16 | 0.3125 | 7.9375 |
| 3/8 | 0.375 | 9.525 |
| 7/16 | 0.4375 | 11.1125 |
| 1/2 | 0.5 | 12.7 |
| 9/16 | 0.5625 | 14.2875 |
| 5/8 | 0.625 | 15.875 |
| 11/16 | 0.6875 | 17.4625 |
| 3/4 | 0.75 | 19.05 |
| 13/16 | 0.8125 | 20.6375 |
| 7/8 | 0.875 | 22.225 |
| 15/16 | 0.9375 | 23.8125 |
| 1 | 1 | 25.4 |
Which millimeter marks your screen can carry
A graduation is a claim that the gap between two marks is what the label says, and on a raster display that claim needs the marks to survive as marks. One pixel of line and two of clear gap is the floor: at a two-pixel pitch a comb aliases into flat gray and there is nothing left to count. So a level is drawn when its pitch reaches three device pixels and is dropped when it does not. Half-millimeter marks need 6.0 device pixels per millimeter, which is 152.4 pixels per inch, and that number is above the two commonest desktop monitors in the world.
| Level | Step | Device px per mm needed | Screen density needed | On a 24-inch 1080p panel (3.61) |
|---|---|---|---|---|
| Centimeter marks, numbered | 10 mm | 0.3 | 7.6 ppi | yes |
| Five-millimeter marks | 5 mm | 0.6 | 15.2 ppi | yes |
| Millimeter marks | 1 mm | 3.0 | 76.2 ppi | yes |
| Half-millimeter marks | 0.5 mm | 6.0 | 152.4 ppi | no |
The message under the ruler rounds the density it quotes up to the next whole pixel per inch, because a screen sitting exactly on a threshold is not above it. What it never does is stay quiet: the level that went is named, and so is the density that would have kept it. Every other online ruler we measured draws half-millimeter marks at any density at all, and the difference between the two behaviors is invisible in a screenshot — which is exactly why it is written down here instead.
The problem, in one number
ISO/IEC 7810 fixes every bank card, ID card and driving license at 85.60 by 53.98 mm. A phone in portrait gives a browser somewhere between about 58 and 71 mm of screen across — an iPhone SE is about 58 mm of usable screen, an iPhone 15 about 64, a 15 Pro Max about 71. Those are approximate figures for the screen area rather than the phone's body, and they are all smaller than 85.60 mm, so the standard instruction cannot be followed. A tool that offers only the horizontal match has therefore pushed every portrait visitor onto the 53.98 mm short edge without saying so, and the short edge carries a wider band.
The same phone is roughly twice as tall as it is wide. Take the screen width and the aspect ratio those screens are built to — 19.5:9 for a modern iPhone, 16:9 for the SE — and the implied height is far more than 85.60 mm in every case. That is the whole opening: the long edge fits, just not in the direction everyone points it.
| Phone | Screen across (approx.) | 85.60 mm fits across? | 53.98 mm fits across? | Implied down the screen | 85.60 mm fits upright? |
|---|---|---|---|---|---|
| iPhone SE | about 58 mm | no | yes | about 103 mm at 16:9 | yes |
| iPhone 15 | about 64 mm | no | yes | about 139 mm at 19.5:9 | yes |
| iPhone 15 Pro Max | about 71 mm | no | yes | about 154 mm at 19.5:9 | yes |
The two right-hand columns are arithmetic, not measurements: screen width multiplied by the aspect ratio the panel is built to. They are here to show that the height is not marginal — the smallest of them clears 85.60 mm by 17 mm — not to tell you the size of your own phone, which this page has not measured and cannot.
Hold the card upright: the full long edge, ±1.2%
This is the mode to use, and it is the one the ruler starts you on when the screen it is running on is taller than it is wide. The card stands long-axis-up against the glass, the outline is drawn as a tall box rather than a wide one, and the reference stays the full 85.60 mm. The band that comes out is the long edge's:
0.351% + 0.818% = ±1.2%. The first term is how far a personalized card may sit from its nominal long edge under ISO/IEC 7810:2019. The second is 0.7 mm of human alignment slop expressed as a share of 85.60 mm. They are added rather than combined in quadrature, because a plus-or-minus sign reads as a bound.
Turning the card upright changes no arithmetic at all. The band belongs to the edge you matched and the care you took lining it up, not to the direction the outline points. What the orientation changes is which options fit on the screen in front of you — which, on a phone in portrait, is the difference between having the long edge and not having it.
Open the ruler with the upright long edge already selected. The link states the reference, the edge and the orientation, and the ruler refuses any of the three by name if it does not recognize it rather than quietly falling back to something else.
Or take the short edge: 53.98 mm, ±1.7%
The short edge fits across every phone in the table, and it is a legitimate match. It costs you accuracy, and here is the cost as a number rather than as a hedge: the same 0.7 mm of alignment slop is 1.59× larger in relative terms against 53.98 mm than against 85.60 mm. Add the short edge's own tolerance and the band goes from ±1.2% to ±1.7% — that is 0.371% + 1.297%.
In practical terms, on a 100 mm reading, ±1.2% is ±1.2 mm and ±1.7% is ±1.7 mm. The ruler prints whichever band you earned beside every reading, and it prints the comparison as a note the moment you match a short edge, so the choice is never invisible.
Open the ruler with the short edge already selected.
What a phone screen can draw that a monitor cannot
Phones are the one place where the graduations are not the problem. A half-millimeter mark needs 6.0 device pixels per millimeter — one pixel of line and two of clear gap, below which a comb of marks aliases into a flat gray band — which is 152.4 pixels per inch. A recent flagship phone is around 18 device pixels per millimeter, so half-millimeter marks are drawn there. A 24-inch 1080p monitor is 3.61 and a 27-inch 1440p is 4.28, and on those two the level is dropped and the omission is stated. The phone is the better instrument here; it is only the calibration step that needed rethinking.