Skip to main content
Screen Ruler (also known as Measure Tool) provides on-screen measurement tools to measure pixels, distances, and dimensions. Essential for UI design, development, and precise screen layout work.

​
Activation

1

Activate Shortcut

Press Win + Shift + M to activate Screen Ruler.
2

Measurement Mode

Click and drag to create measurement lines on screen.
3

Close Tool

Press Esc or click outside the measurement area to exit.
Customize the activation shortcut in PowerToys Settings > Screen Ruler.

​
Measurement Modes

Screen Ruler provides multiple measurement styles:

​
Measure Styles

From source /src/modules/MeasureTool/MeasureToolUI/Settings.cs:16-28:
Measure horizontal distances across the screen.
  • Click and drag horizontally
  • Displays pixel width
  • Shows start and end coordinates
The default measurement style is configured through: 
MeasureToolMeasureStyle.None // From Settings.cs:26

​
Features

​
Pixel-Perfect Measurements

Screen Ruler measures in screen pixels with:
  • 1-pixel precision
  • Real-time coordinate display
  • DPI-aware measurements
  • Multi-monitor support

​
Visual Indicators

Measurement Lines

Colored overlay lines show measurement boundaries with pixel counts.

Coordinate Display

Live X/Y coordinates update as you move the cursor.

Distance Labels

Pixel measurements appear next to measurement lines.

Crosshair Cursor

Precise cursor positioning for exact measurements.

​
Multi-Monitor Support

Screen Ruler works across multiple displays:
  • Measure across monitor boundaries
  • DPI-aware for mixed DPI setups
  • Virtual screen coordinate system

​
Use Cases

Verify Design Specifications:
  • Check element dimensions match mockups
  • Measure spacing between components
  • Verify alignment and padding
  • Ensure consistent margins
Example: Measure button width to verify it matches 120px design spec.
CSS Layout Verification:
  • Measure responsive breakpoints
  • Check element positioning
  • Verify flexbox/grid spacing
  • Debug alignment issues
Example: Measure container width to ensure CSS max-width is correct.
Window and Control Sizing:
  • Measure dialog box dimensions
  • Check control spacing
  • Verify window layouts
  • Test responsive behavior
Example: Measure dialog button spacing to ensure consistency.
Compare Layouts:
  • Measure elements in screenshots
  • Compare before/after changes
  • Document dimensions
  • Create specifications
Example: Measure navbar height in competitor’s app for reference.
Touch Target Sizes:
  • Verify minimum touch target sizes (44×44px recommended)
  • Check button dimensions
  • Measure interactive elements
  • Ensure WCAG compliance
Example: Measure mobile button to ensure it meets 44px minimum.

​
Keyboard Shortcuts

ShortcutAction
Win + Shift + MActivate Screen Ruler (default)
EscClose Screen Ruler
Click + DragCreate measurement
Shift + DragConstrain to horizontal/vertical
Hold Shift while dragging to snap measurements to horizontal or vertical axes.

​
Configuration

​
Activation Shortcut

Customize the activation shortcut in PowerToys Settings:
1

Open Settings

Open PowerToys Settings > Screen Ruler.
2

Change Shortcut

Click the activation shortcut field and press your desired key combination.
3

Save

Click outside the field to save the new shortcut.

​
Display Settings

Configure measurement display options:
  • Measurement line color
  • Label font size
  • Transparency level
  • Crosshair style

​
Default Measurement Style

Set the preferred measurement mode:
  • Bounds (rectangular)
  • Horizontal ruler
  • Vertical ruler
  • Spacing detection

​
Advanced Features

​
DPI Awareness

Screen Ruler is DPI-aware for accurate measurements on high-DPI displays:
  • Correctly measures on 4K/5K monitors
  • Handles mixed DPI multi-monitor setups
  • Scales measurements appropriately
  • Reports actual pixel values, not scaled

​
Spacing Detection

Automatic spacing measurement between UI elements:
1

Enable Spacing Mode

Select “Spacing” measurement style in settings.
2

Hover Over Element

Move cursor near UI element edge.
3

View Spacing

Tool automatically detects and displays spacing to adjacent elements.
From test file /src/modules/MeasureTool/Tests/ScreenRuler.UITests/TestSpacing.cs:
  • Horizontal spacing detection: TestSpacingHorizontal.cs
  • Vertical spacing detection: TestSpacingVertical.cs

​
Bounds Measurement

Measure rectangular areas with full dimension display: 
Width: 320px
Height: 240px
Area: 76,800 sq px
From test file /src/modules/MeasureTool/Tests/ScreenRuler.UITests/TestBounds.cs

​
Troubleshooting

  • Verify Screen Ruler is enabled in PowerToys Settings
  • Check activation shortcut is not conflicting with other applications
  • Ensure PowerToys is running
  • Try restarting PowerToys
  • Check Windows display scaling settings
  • Verify DPI scaling is configured correctly
  • For multi-monitor: ensure monitor arrangement matches physical setup
  • Some applications use non-standard DPI which may affect measurements
  • Check if overlay is behind fullscreen applications
  • Verify display settings aren’t hiding the overlay
  • Try changing measurement line color in settings
  • Restart Screen Ruler with activation shortcut
  • Verify monitor arrangement in Windows display settings
  • Check DPI settings for each monitor
  • Ensure monitors are set to recommended resolution
  • Try measuring within a single monitor first

​
Design Workflow Integration

​
Figma/Sketch to Implementation

1

Reference Design

Open design mockup in Figma/Sketch or export as image.
2

Measure Implementation

Use Screen Ruler to measure actual implementation in browser/app.
3

Compare

Compare measurements against design specifications.
4

Adjust

Adjust implementation to match design pixel-perfect.

​
QA Testing Workflow

  1. Activate Screen Ruler during QA testing
  2. Measure UI elements against requirements
  3. Document discrepancies with measurements
  4. Create bug reports with exact pixel measurements
  5. Verify fixes using Screen Ruler

​
Source Code

Location: /src/modules/MeasureTool/
  • Main UI: MeasureToolUI/MeasureToolXAML/
  • Settings: MeasureToolUI/Settings.cs
  • UI Tests: Tests/ScreenRuler.UITests/
  • Test coverage:
    • Bounds: TestBounds.cs
    • Spacing: TestSpacing.cs
    • Horizontal spacing: TestSpacingHorizontal.cs
    • Vertical spacing: TestSpacingVertical.cs
    • Shortcut activation: TestShortcutActivation.cs

Build docs developers (and LLMs) love

Get started for freeTalk to us