Online Display Ruler

1. Open the ruler at the top of this page. It works in a modern browser on desktop, laptop, tablet, and mobile screens.
2. For a physical measurement, select Calibrate and use a known reference. Set browser zoom to 100% before matching a reference.
3. Choose in, cm, mm, or px in the Units control. Inch mode can show fractions or decimals.
4. Choose a reference corner to move the ruler’s zero point to the desired corner. The top, bottom, left, and right scales remain visible.
5. For a simple length, line up one end with zero and read the other end. Keep a flat object in contact with the screen without pressing on it.
6. For a span between two nonzero points, select Two points and click or drag across the workspace. You can also add a guide line for alignment.

Go to the Online Display Ruler · See the tool overview or contact us about a measurement issue.

Displays pack different numbers of physical pixels into different panel sizes. A web page lays out this ruler in CSS pixels, which are a browser-defined unit; CSS defines 1 inch as 96 CSS pixels, but that conversion does not guarantee that 96 pixels occupy one physical inch on every monitor. The CSS Values specification describes the relationship between CSS absolute units.

A device pixel ratio is a mapping between CSS pixels and device pixels, not a measurement of a panel’s physical pixel density. Browser zoom and operating-system display scaling can change the effective mapping as well. Calibration estimates how many CSS pixels on this screen correspond to a physical inch, so the ruler can convert its CSS-coordinate measurements into inches, centimeters, and millimeters.

For example, if a CSS inch is rendered as 0.9 physical inches on a particular setup, a displayed 6-inch span would be about 5.4 physical inches before calibration. A reference measurement adjusts that relationship; the example illustrates the calculation and is not a benchmark for any device.

Open the calibration dialog. Its methods propose a scale in preview; the live ruler changes only after you select Apply Calibration. Cancel keeps the current setting. A preview is an estimate unless it is matched against a suitable physical reference.

Auto-detect

The browser may expose a screen model hint. The ruler applies a device reference only when the hint exactly and uniquely matches a supported catalog entry; it does not guess from device pixel ratio. This is quick when a match is available, but browsers often hide model details, and a model alone may not identify different panel options.

Device selection

Search the supported list and choose the exact model and display configuration. Reference panel PPI comes from manufacturer specifications or from native resolution and diagonal when PPI is not stated. This is a useful starting estimate if the panel configuration is known; verify it with a card or known length because zoom, scaling, and model variants can change the result.

Screen diagonal

Find the physical display diagonal in the device’s specifications, then enter it in inches. The method combines that value with the screen dimensions reported by the browser. It is convenient when the diagonal is known, but rounded marketing sizes and a reported screen area that differs from the physical panel can introduce error.

Physical card matching

Choose Card, set browser zoom to 100%, and hold an ID-1 card flat against the screen in landscape orientation. Adjust the on-screen outline until it matches the card’s width and height. The app uses the nominal ISO/IEC 7810 ID-1 dimensions of 85.60 × 53.98 mm. This direct comparison works well when you have a standard bank or payment card, but card wear, raised details, parallax, and alignment can affect the match. ISO/IEC 7810 reference.

Known-length matching

Choose Known Length, enter the length of a physical object or a line measured with a trusted ruler, select its unit, then adjust the preview line until it matches. This can be precise when the reference length is reliable and you can place it flat against the screen. A short or flexible object, inaccurate source measurement, or poor alignment reduces confidence.

Centimeters and millimeters

In centimeter mode, each numbered major mark represents 1 cm; the small ticks between are millimeters, with a medium tick at 5 mm. For example, a point at the seventh small tick after 3 cm is 3.7 cm (37 mm). In millimeter mode, each small tick is 1 mm and the numbered marks indicate centimeters in millimeters, such as 30 mm. See how to measure in centimeters.

Inches and fractions

Each inch is divided into 16 equal intervals. The medium mark at the halfway point is 1/2 inch; shorter ticks represent eighths and sixteenths. The major tick marks whole inches. For instance, the sixth small interval after 2 inches is 2 3/8 inches. Choose fractional or decimal display in the Inch marks control. For a physical inch, calibrate first; see how to find one inch on screen.

CSS pixels

Pixel mode reports distances in CSS pixels across the ruler workspace. The scale has a tick at each CSS pixel and a numbered major mark every ten pixels; some labels are skipped when space is tight. Use it for web-layout checks, comparing element spans, or positioning a design reference. CSS pixels are not guaranteed to be physical display pixels or a physical length.

• Calibrate before measuring physical lengths; use a card or known length when available.
• Keep browser zoom at 100% while calibrating. If zoom changes later, recalibrate.
• Remember operating-system scaling can affect physical size even if browser zoom is unchanged.
• Look straight at the screen to reduce parallax, align one edge carefully with zero, and keep the reference flat against the display.
• Recalibrate after switching monitors or changing display resolution, scaling, or zoom. Stored calibration belongs to this browser and display setup.
• Use guide lines or the two-point tool to mark a span; use the crosshair for cursor coordinates.
• Do not place heavy, sharp, hot, or abrasive objects against a screen. Avoid pressing on the panel.

These dimensions can help you check a scale when the reference is flat and measured edge-to-edge. Regional products and physical tolerances vary; everyday objects are a check, not a substitute for a professional instrument.

Sources: ISO/IEC 7810 for ID-1 cards, ISO 216 A4 dimensions, USPS reference to 8.5 × 11-inch paper, and the SD Association form-factor dimensions.

Coins vary by country, denomination, and issue. If you use one as a reference, confirm its diameter from the issuing mint or central bank instead of relying on a generic coin size.

Use this screen ruler for everyday comparisons that fit within the visible workspace, such as small flat objects, craft materials, jewelry components, screws, bolts, and other hardware. Place items gently and avoid putting anything sharp, heavy, or damaging on the screen.

For documents, photos, and printed templates, measure a flat edge or compare the on-screen design to a physical reference. For frontend work, pixel mode can compare CSS-coordinate spans and layout elements; use your browser’s developer tools for exact computed styles. For a nonzero span, use the two-point measurement or a guide line.

The ruler can help with quick screen-size checks and visual references, but it does not measure with a camera, inspect a file, or determine print dimensions from a document. For printed work, confirm the document’s page size and printer scaling in the application that produces the print.

There is no single accuracy figure for every display. A card matched carefully on a flat screen provides a more direct reference than an unverified device estimate, but all methods can be affected by display hardware, zoom, operating-system scaling, calibration reference, and alignment. Objects held away from the screen, curved objects, thick edges, or a viewing angle make the comparison harder. The usable screen area also limits the longest span you can measure.

An Online Display Ruler is for everyday reference measurements. Do not rely on it for precision engineering, machining, medical decisions, safety-critical work, or any task that requires a certified tolerance. Confirm important dimensions with a suitable physical measuring instrument. Read more about accuracy limits and why the displayed size may change.

Use these exact relationships: 1 inch = 2.54 centimeters = 25.4 millimeters, and 1 centimeter = 10 millimeters. For example, 3 inches = 7.62 cm = 76.2 mm; 12 inches = 1 foot = 30.48 cm; and 15 cm = 150 mm ≈ 5.91 inches.

To convert inches to centimeters, multiply by 2.54; to convert centimeters to inches, divide by 2.54. Convert centimeters to millimeters by multiplying by 10.