We would like to count visits with Google Analytics so we know which tools are worth improving. It sets cookies. The ruler works exactly the same either way, and refusing costs you nothing.
Online Ruler in cm and Inches
A real-size ruler that runs in your browser. Calibrate once with a bank card, then measure anything you can hold against the screen, in centimetres, millimetres, inches or pixels.
On-screen ruler
Calibrate before you rely on this. Until you do, this ruler assumes a generic screen density, which is wrong on most screens by 10 to 70 percent. Match a bank card to make it exact.
Drag across the ruler to measure. You can also focus it and use ← →, Shift for larger steps.
Need more length? Show a full-width ruler on any edge of your display. Turn on two of them and you get a width and a height in one pass.
Measured
A free online ruler you can trust
Anyone searching for an online ruler wants the same thing: a number they can act on. That turns out to be the one job a web page cannot do unaided. Browsers lay out in CSS pixels, and the specification pins a CSS pixel at 1/96 of an inch. Real hardware pays no attention:
- A 27-inch 1440p monitor lands near 109 pixels per inch.
- A 24-inch 1080p panel sits around 92.
- A high-density 13-inch laptop can exceed 160.
Draw a line labelled 10 cm without accounting for any of that and you can be out by more than half its length.
So this ruler asks you one question first. Hold a bank card flat to the glass and drag the slider until the outline beneath it lines up. That single match tells the tool your display's true pixel density. Payment cards work well for the job because every one of them, anywhere in the world, is built to ISO/IEC 7810 ID-1 at 85.6 mm wide by 53.98 mm tall, and most people have one within reach. With no card to hand, the dialog also takes any object you have measured yourself: type its width and match the bar to it. That counts as a real calibration rather than an estimate, because it is the same comparison against the glass. Afterwards the readings are genuine actual size ruler measurements rather than estimates, and the value is stored so you never repeat the step on that device. The reasoning behind why this step cannot be skipped is worth reading in full in why two on-screen rulers never agree.
How to measure on your screen
Start by putting browser zoom back to 100%. Ctrl+0 does it, or Cmd+0 on a Mac. Zoom rescales CSS pixels, which quietly invalidates any calibration you have saved. Then pick a unit and drag across the ruler. The readout follows as you go and always carries the equivalent in the other measuring system, so a cm ruler online doubles as an inch ruler with no switching about. The keyboard works too: focus the ruler and use the arrow keys, holding Shift to jump a whole centimetre or inch at a time.
There are four units, on three scales:
- Centimetres and millimetres share one scale, graduated like a metric school rule and labelled every centimetre with fine millimetre subdivisions between.
- Inches run in sixteenths with the familiar stepped tick heights, and the readout adds the nearest fraction beside the decimal, which helps if you are working from imperial drawings.
- Pixels ignore calibration entirely and count raw screen pixels, which is normally what designers and front-end developers are after.
Length is the obvious limit of any ruler stuck inside a page, and two things push against it. You can dock a ruler to any edge of the display, where it runs the full width or height of the viewport instead of the width of this column. You can also put the tool fullscreen. Dock a horizontal and a vertical ruler together and you get a width and a height in one pass.
What people measure with a virtual ruler
Mostly small things, when no tape measure is nearby. A ring's inner diameter before ordering a size. The width of a screw or a drill bit. A SIM tray, the bezel on a phone case, a photo that has to fit a frame. Sellers check a listing's stated dimensions against it. People who sew and make things use millimetre mode for beads and thread. Students reach for it when a homework diagram needs measuring and the ruler is in a bag somewhere else. The buttons cover what comes up most: a phone, a bank card, a tablet, and the A4 and US Letter sheet widths. The picker beside them holds the rest, grouped into phones, tablets, laptops and discs, with each width taken from the maker's own specification. Anything wider than your ruler is greyed out and says so rather than quietly giving you a shorter number. Any of them doubles as a quick check on your calibration.
Some limits are worth stating plainly:
- Nothing wider than your display can be measured in one pass, so a 15-inch laptop gives you about 33 cm across in landscape.
- Soft or curved objects are awkward to hold flat against glass.
- A calibration belongs to the screen it was made on, so if you move to a different monitor, or change your operating system's display scaling, do it again.
Inside those limits a calibrated screen ruler is good to roughly half a millimetre, which beats what most people manage with a tape.
None of this needs an account, a download or an extension. The page is static HTML and CSS with a small amount of JavaScript running on your device. No measurement, image or calibration value is uploaded anywhere. It also means the page loads almost immediately and keeps working offline once it has been cached.
With nothing digital in reach, the same standard-sized objects still work by eye. See how to measure something without a ruler for the method.
Frequently Asked Questions
How do you read a ruler?
Count the numbered marks for whole units, then the smaller marks between them. On the centimetre edge each numbered mark is 1 cm and the nine short marks between are millimetres. On the inch edge the marks halve repeatedly: the longest is a half inch, then quarters, eighths and sixteenths. Read the last mark the object reaches, not the one it is closest to.
How do I see 1 inch on a ruler?
One inch is the gap between two consecutive numbered marks on the inch edge. Switch this ruler to inches and the numbers are inches, so the space from 0 to 1 is exactly one inch once the ruler is calibrated. A bank card is a useful check: it is 3.37 inches long, so it should span from 0 to just past the third inch mark.
How do I read inches on a ruler?
Inch rulers are divided in halves rather than tenths, which is what makes them awkward. Sixteen small marks make one inch: the longest mark in the middle is 1/2, the next longest are 1/4 and 3/4, then eighths, then sixteenths. This ruler prints the fraction next to the reading so you do not have to count marks.
How do I use an online ruler?
Calibrate it once against something you already own, then hold the object against the screen and read off the scale. Calibration is the whole job: without it the ruler is drawn in pixels, and a pixel is a different physical size on every screen.
How do I calibrate the ruler to actual size?
Open Calibrate and match the outline on screen to a bank card, which is 85.6 mm wide under ISO/IEC 7810 and therefore the same in every wallet in the world. You can also enter your screen's diagonal, or type a known length. The setting is saved on your device, so you do it once.
Why does the ruler show the wrong size?
Because it has not been calibrated yet, or the page is zoomed. A browser at 110 % zoom makes every measurement 10 % too long. Reset zoom with Ctrl+0 (Cmd+0 on a Mac), then calibrate.
Can I use the online ruler on my phone?
Yes, and calibration matters more there, because phone screens vary far more in pixel density than laptops do. Calibrate against a bank card exactly as on a desktop.
Can I measure something larger than my screen?
Mark the object at the end of the ruler, slide it along, and add the readings. The screen size checker will tell you exactly how much length you have to work with in one pass.