Real SizerOnline 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
This digital ruler is actual size on your screen once you match it to a bank card. Until then it draws from the CSS specification's assumption that an inch is 96 pixels, which is wrong on almost every display, and the readout says so. A twenty-second match replaces that assumption with a measurement of your own screen, and each reading after it carries the error band that match earned.
UNCALIBRATED: assumed 96 CSS ppi
Match a bank card to calibrate the ruler to your screen.
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. This screen would need 153 ppi to show them.
Calibrate in four steps
- 1. Choose a safe reference. Hold a clean, flat, undamaged, smooth-edged ID-1 card just above the display without touching it. Do not press or slide it.
- 2. Match the outline. Look square-on. Choose the edge and direction, then drag to align. Any gap or tilt is outside the printed error band.
- 3. Confirm the match. Press This matches my card once the outline and the card agree.
- 4. Read the result. Check Calibration, Reference and Error band above.
Optional: this moves the outline near the likely size. You still need to match and confirm it.
Limits that still apply
An ID-1 card is nominally 85.60 by 53.98 mm, and the spread its standard permits is part of the printed error band. The calibration walkthrough and reference table lists which objects were checked and why the rest are withheld.
The edge and direction matter. Laid 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. Stood upright on a tall screen, the long edge fits and keeps the ±1.2% band. The 53.98 mm short edge fits in more places but widens the band to ±1.7%. The page starts tall screens on the upright long edge and says so under the ruler.
A stated screen size only positions the outline. It is not a calibration and never turns anything green, because it assumes the reported pixel count belongs to the panel. That assumption is false under macOS scaled resolutions, in Safari under page zoom, and when privacy settings rewrite those numbers. After a match, comparing the two figures is only a sanity check.
The readout turns green only after a reference match you completed. It shows neutral for a stored calibration whose display changed, one old enough to need a re-check, one that failed its own checks on reload, and a live pinch-zoom, because none of those is a current measurement.
Check it against a second object
After the card, you can check the calibration against 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 1% the number is printed and the card measurement stands unchanged. Two independent measurements that agree are the only thing on this site that earns the word verified.
The tool accepts paper only for this second check and refuses it as the calibration itself. A sheet bows away from a vertical screen, and that bias is systematic: the ±1.0% band on the A4 long edge covers ISO 216's ±2 mm and your alignment, and the bow falls outside it. What paper does have 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
Above 1%, the sheet has not confirmed the card, and it has not shown the card wrong either. A card at ±1.2% and an A4 long edge at ±1.0% can differ by ±2.1% with both readings correct and inside their own bands, while the cross-check passes only inside 1%. 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 level of marks is drawn only when neighboring marks land at least three device pixels apart, which leaves one pixel of line and two of clear gap. At a two-pixel pitch a comb of marks aliases into flat gray and there is nothing left to count. Half-millimeter marks therefore 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 that:
| 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 |
On those screens the level is dropped, and the note under the ruler says which level went and what density the screen would need to keep it.
The tools on this site
-
On the screen
CSS pixel rulerMeasures an image, gap or interface element inside the page in CSS pixels, without using the card calibration.
-
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 offered, the ones withheld and the reasons recorded for each, 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 is, so a ruler drawn from that number is right only by coincidence. You supply the missing measurement: hold a clean, smooth-edged object of known size just above the display without touching it, and align the outline to it. 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. Snapping them to the pixel grid would move a mark by up to half a pixel, 0.13 mm on a typical monitor, and over a 10 mm reading that is a larger error than the band this page prints.
How it is kept. The page stores device pixels per millimeter. Page zoom changes 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 both: measured across four display scales, 100 mm rendered at the same device-pixel width every time. Two cases need a fresh match. Safari does not report page zoom through the pixel ratio, and a macOS scaled resolution changes the reported pixel count instead; in both, the readout leaves green and asks for another twenty seconds. To catch them, the page records what the display was reporting alongside the density (pixel ratio, native pixel count, browser chrome, layout scale) and compares those readings on every visit and on a timer, because a pixel-ratio change can happen without firing any event. The calibration is one record, and every ruler here that needs a calibration reads it: the millimeter ruler, the inch ruler, the actual-size ruler and the phone ruler are all this page, so one card match covers every unit and orientation. It does not travel to another browser, another device or another site: browser storage is kept per site and per browser, and nothing here is sent anywhere.
What it cannot tell you. No ruler in a browser can detect a move to a different monitor of the same resolution: taking a 1080p profile from a 24-inch panel to a 32-inch one leaves the ruler a third wrong while every signal on the page stays identical. Casting, mirroring, screen magnifiers and a same-profile move to another machine go undetected for the same reason, so the page re-checks the calibration whenever the display reports anything new and offers a fresh match after a long gap. The error band covers the object's dimensional spread and your alignment. A gap or tilt above the display, screen curvature and paper flexing near a vertical panel are outside it, and the site deals with those through which objects it offers at all.
What an uncalibrated inch measures
CSS defines an inch as exactly 96 pixels and a millimeter as 96/25.4 pixels. No shipping browser resolves those units against the real geometry of the display, because no browser is told what that geometry is. The often repeated idea that physical units "become real" on high-density devices comes from how the specification describes its anchor unit, and no browser implements it. An uncalibrated on-screen ruler is off by 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%) |
In the seven calculated examples on this page, a CSS inch ranges from 66 percent short to 4.6 percent long. 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.
The errors run in both directions, so no single correction factor fixes them, and they are large enough to matter when you measure a physical object. Keep hard or abrasive objects away from the display; measure those with the printable ruler or another physical ruler. The scale error is also invisible: an uncalibrated ruler drawn at 96 pixels per inch looks exactly like a calibrated one, which is why the calibration state is printed beside every reading.
Measuring an image, a button or a gap inside a page is a different task. That is a layout distance, exact in CSS pixels with no calibration at all, and it has its own instrument.
Inch fraction chart: every sixteenth of an inch, in decimals and millimeters
Every value here is exact. The inch has been defined as exactly 25.4 mm since the international yard and pound agreement of 1959, so each row is arithmetic with no uncertainty in it at all. Any error in a reading you take comes from the ruler and your eye, and none of it 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
Each level of marks has its own threshold under the same three-pixel rule. A level is drawn when its pitch reaches three device pixels on your screen and is dropped when it does not. This table gives the density each level needs:
| 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 density quoted in the note under the ruler is rounded up to the next whole pixel per inch, because a screen sitting exactly on a threshold is not above it.
A card's long edge on a phone screen
A bank card, and any ID card or driving license in ISO/IEC 7810 format ID-1, is 85.60 by 53.98 mm. A phone in portrait gives a browser about 58 to 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 widths of the screen area, and all of them are smaller than 85.60 mm, so the long edge cannot be matched across a phone in portrait. A horizontal match there leaves only the 53.98 mm short edge, which carries a wider band.
The same screens are roughly twice as tall as they are wide. Multiply the screen width by the aspect ratio each is built to (19.5:9 for a modern iPhone, 16:9 for the SE) and the implied height is well over 85.60 mm in every case, so the long edge fits upright.
| 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: screen width multiplied by the aspect ratio the panel is built to. They show that the height has room to spare, since the smallest of them clears 85.60 mm by 17 mm. They are estimates for these models; this page has not measured your phone and cannot.
Align the card upright: the full long edge, ±1.2%
Use this mode on a phone in portrait; the ruler starts in it whenever the screen is taller than it is wide. Turn the clean card so its long edge runs up the screen, holding it just above the display without touching it. Do not press or slide it on the glass. The outline is drawn as a tall box, the reference stays the full 85.60 mm, and the band 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 none of this arithmetic: the band is set by the edge you matched. Orientation changes only which edges fit on the screen in front of you, and on a phone in portrait that decides whether you can use the long edge at all.
Open the ruler with the upright long edge already selected. The link sets the reference, the edge and the orientation. If the ruler does not recognize one of the three, it refuses it and says which value it refused.
Or take the short edge: 53.98 mm, ±1.7%
The short edge fits across every phone in the table and is a valid match, at some cost in accuracy. Against 53.98 mm, the same 0.7 mm of alignment slop is 1.59× larger in relative terms than against 85.60 mm. Add the short edge's own tolerance and the band goes from ±1.2% to ±1.7%, which is 0.371% + 1.297%.
On a 100 mm reading, ±1.2% is ±1.2 mm and ±1.7% is ±1.7 mm. The ruler prints the band for the edge you matched beside every reading, and adds a note comparing the two bands as soon as you match a short edge.
Open the ruler with the short edge already selected.
What a phone screen can draw that a monitor cannot
On a phone, fine graduations are no problem. A recent flagship phone has around 18 device pixels per millimeter, well above the 6.0 that half-millimeter marks need, so they are drawn there. A 24-inch 1080p monitor has 3.61 and a 27-inch 1440p has 4.28, so on those two the level is dropped and the note under the ruler says so. For fine marks the phone is the better instrument, and the upright match above takes care of its calibration.