Designers
Check spacing, components, mockups and print sizes before shipping.
Choose an edge from the toolbar above, or use one of the quick controls below.
Turn your browser into a fast, accurate screen ruler. Measure small objects in centimeters, millimeters, inches, or pixels directly on your computer monitor, laptop, tablet, or phone display. Calibrate with a physical reference card for actual size measurements.
Physical calibration remains the source of truth. Use the verification panel to confirm your display before measuring an object.
Hold a real physical ruler or tape measure against the four test bars below to verify true 1:1 scale fidelity.
Measure the on-screen 100.0 mm bar with your physical ruler. Enter the observed length to calculate error and auto-correct.
Calibrate the display against a real physical reference once, then use the same measured scale without depending on a phone model catalog.
The interface stays quiet because the measurement is the point. The same tool can move between design checks, code work, study, and practical making without becoming a dashboard.
Check spacing, components, mockups and print sizes before shipping.
Compare CSS pixels with physical dimensions and inspect responsive layouts.
Check small parts, fasteners, PCB spacing and workshop dimensions.
Measure diagrams, geometry figures and physical references without installing an app.
Most measurements are straightforward. When real-world size matters, physical calibration provides a reliable 1:1 scale on your display.
An online ruler is a browser-based measurement utility that renders a real-world dimensional scale in centimeters, millimeters, inches, or pixels directly on your computer monitor, tablet, or smartphone screen.
Accuracy depends on your display hardware and calibration. Browsers work with CSS coordinates rather than a universal physical millimeter measurement of the active panel. A physical reference such as a standard card or a known ruler is the strongest way to verify the scale on the screen you are using.
Click Calibrate in the toolbar. Place a standard ISO/IEC 7810 ID-1 card (such as a compatible bank, ID, or transit card) or a physical ruler against the calibration reference, then adjust the on-screen scale until the known length matches.
The initial scale is an estimate. Display density, browser zoom, operating-system scaling, and the chosen screen can all change the relationship between CSS pixels and physical millimeters. Calibration measures the correction for the current setup.
Yes. Browser zoom changes the size of the page in CSS coordinates. For physical measurements, set the browser to 100% and recalibrate after changing zoom.
Yes. The ruler can be used on touchscreens as well as laptops and desktop monitors. For physical-size work, calibrate the active display before measuring.
Yes. Laptops and external monitors can both be used. Screens with different physical pixel densities should be treated as separate measurement environments and calibrated separately.
Select cm or mm in the unit toolbar. Align one edge of the object with the zero mark, then read the scale or place a draggable measurement guide at the opposite edge.
Select inches in the unit toolbar. The scale includes fractional subdivisions and the measurement readout can show the corresponding decimal value.
The measurement calculations and saved calibration values are handled in the browser. The site may use optional analytics configured by the deployment, but measurement values are not uploaded as a measurement dataset.
Use cm, mm, inches or pixels, calibrate when the physical size matters, and keep the rest of the interface out of your way.