Step-by-Step Guide to Calibrating and Using an Online Screen Ruler

1. 3-Step Calibration Procedure

1. Verify Browser Zoom: Press Ctrl + 0 (or Cmd + 0 on Mac) to reset display zoom to 100%.
2. Select Calibration Mode: Click [Calibrate] in top bar and select either [Credit Card] or [Monitor Size].
3. Align Physical Reference: Hold a physical credit card against screen, adjust container width to match 85.60 mm width, and save.

2. Measuring Multiple Items with Multi-Markers

RulerHero supports creating multiple draggable measurement markers simultaneously:

• Click or tap anywhere on ruler area to spawn new color-coded marker lines.
• Drag markers to align with your target object's endpoints for real-time length readouts.
• Remove unwanted markers anytime using the ✕ icon next to the marker label or in the Record tab.

3. Smartphone Usage

Place physical objects directly on your mobile screen and drag markers using touch controls for fast mobile measurements.