Screen Ruler

Measure elements on your screen in Pixels (px), Centimeters (cm), and Inches (in). Use the calibration tool for exact real-world dimensions.

Accuracy Disclaimer: For high accuracy in real-world units (cm, inches) on laptops or phones, you MUST use the Calibration feature!

Digital Measurement Tool

--
px

Free Online Screen Ruler & Pixel Measurer

Measuring physical objects on a digital display or checking UI elements can be tricky. This browser-based screen ruler allows you to measure any on-screen element in Pixels (px), Centimeters (cm), and Inches (in) instantly. Whether you are a web designer checking layout dimensions, or a user trying to measure a physical screw or coin against your screen, this tool provides a flexible digital overlay.

Quick 3-Step Guide

  • Launch Ruler Overlay: Click the start button above to activate the digital measuring box on your screen.
  • Select Unit: Use the controls to toggle between Pixels (px), Centimeters (cm), or Inches (in).
  • Calibrate with a Card: For true real-world measurements, click "Calibrate" and match the box to a physical credit card.

How Calibration Works for True Centimeters & Inches

Modern screens, like Retina displays on MacBooks or high-DPI Windows laptops, pack multiple physical hardware pixels into a single "software pixel" to make text look sharper. Because of this, 100 pixels on a 4K monitor will be physically much smaller than 100 pixels on an older 1080p monitor.

By default, web browsers assume a standard screen density of 96 PPI (Pixels Per Inch). To solve this, our tool includes a Calibration Mode. A standard credit card or ID card is exactly 85.6 mm (3.37 inches) wide worldwide. By placing a physical card on your screen and resizing our digital box to match it, the software calculates a device-specific conversion ratio (pixels to millimeters) for your specific display. This results in highly accurate real-world measurements.

Measuring Elements on Different Devices

Because this is a web-based tool, it is designed to work across most modern devices without downloading any extensions.

  • Laptops & Desktop Monitors: Works seamlessly on Windows monitors and Apple MacBooks. If you are examining your monitor closely while measuring, it is also a great time to check for display hardware defects using our Dead Pixel Test or verify your panel's speed with our Refresh Rate Test.
  • Smartphones & Tablets: You can use the ruler on an iPad, iPhone, or Android device. We highly recommend rotating your mobile device to landscape mode for a much wider workspace when using the ruler overlay.

Screen Ruler FAQ

How accurate is this online screen ruler?

By default, the ruler measures exactly in CSS pixels. However, for real-world units like centimeters (cm) and inches (in), accuracy depends on your screen's pixel density. Using the built-in calibration tool ensures highly accurate real-world measurements.

Do I need to calibrate the digital ruler?

If you only need to measure elements in Pixels (px), no calibration is needed. If you want to measure real-world items or check physical dimensions in centimeters or inches, you must use the calibration feature for accurate results.

Will placing a physical card damage my display?

Gently placing a clean plastic card (like a credit card or ID) against most glass-covered displays is generally safe, but scratching risk depends on debris, damaged card edges, and screen condition. Make sure the card and screen are clean before contact.

Can I measure elements in other browser tabs or apps?

Browser security prevents our web-based tool from rendering over other browser tabs or desktop applications. To measure something outside this window, take a screenshot, open the image in this tab, and measure it here.

Does this work on smartphones and tablets?

Yes, this tool works on most modern devices including iPhones, iPads, and Android phones. Rotating your device to landscape mode will give you a wider workspace for measuring.