Screen Ruler — Virtual On-Screen Measurement Tool
| Time | Measurement | Unit | Action |
|---|
| Time | Measurement | Unit | Action |
|---|
Whether you are a graphic designer checking margin widths, an architect inspecting scaled blueprints, or someone who simply needs to measure a bolt or credit card against their laptop screen, this virtual screen ruler gives you pixel-accurate and millimeter-true measurements directly in your browser.
Measure UI components, margins, font sizes, and layout gaps in standard CSS pixels with 10px and 50px tick intervals.
Calibrate for any external monitor (24", 27", 32") using our screen diagonal tool or standard credit card alignment.
Switch between horizontal and vertical modes with one click or press O to measure along screen margins.
Because screen sizes and resolutions vary, your screen ruler must calculate the exact physical PPI to prevent measurement distortion. Here is how standard displays compare:
| Display Type | Resolution | Diagonal | Native PPI | 1 Inch on Screen |
|---|---|---|---|---|
| Standard Office Monitor | 1920 × 1080 (FHD) | 24.0" | 91.8 PPI | 92 CSS pixels |
| QHD Productivity Monitor | 2560 × 1440 (2K) | 27.0" | 108.8 PPI | 109 CSS pixels |
| 4K UHD Designer Monitor | 3840 × 2160 (4K) | 27.0" | 163.2 PPI | 163 physical px |
| 15.6" Windows Laptop | 1920 × 1080 (FHD) | 15.6" | 141.2 PPI | 141 CSS pixels |
| Apple MacBook Pro 16" | 3456 × 2234 (Liquid Retina) | 16.2" | 254.0 PPI | 127 points @ 2x DPR |