Screen Ruler - Measure The Web

Measure sizes, distances, margins and paddings of any element on any web page.
What is Screen Ruler - Measure The Web?
Screen Ruler - Measure The Web is a Chrome extension for web developers and designers to validate the implementation of their websites. It allows users to view and measure sizes, margins, paddings, tag names, IDs, and classes simply by hovering over any element, select an element to measure distances to other elements, and more.

Extension stats

Users: 10,000+
Rating: 4.58 (24)
Version: 2.2.5 (Last updated: 2024-09-24)
Creation date: 2024-03-29
Risk impact: Low risk impact
Risk likelihood: Low risk likelihood
Manifest version: 3
Permissions:
  • scripting
  • activeTab
  • contextMenus
  • commands
  • storage
  • offscreen
  • declarativeContent
  • sidePanel
Size: 226.30K

Other platforms

Not available on Firefox
Not available on Edge
Want to check extension ranking and stats more quickly for other Chrome extensions? Install Chrome-Stats extension to view Chrome-Stats data as you browse the Chrome Web Store.
Chrome-Stats extension

Extension summary

Analyze keywords

Screen Ruler is the perfect companion for web developers and designers wanting to validate the implementation of their websites. Once activated, Screen Ruler allows you to view the sizes, margins, paddings, tag names, IDs, and classes simply by hovering over any element. You can also select an element to measure distances to other elements.

Usage

  • Toggle Screen Ruler by clicking the extension icon, selecting “Screen Ruler” from the right-click context menu, or using the shortcut Alt/Option + Shift + R.
  • Hover over elements on web pages to display their sizes, margins, paddings, tag names, IDs, and classes.
  • Select an element by clicking on it directly, this will turn the highlight red. To deselect, click again, press Escape or select a different element.
  • To select the parent of an element, use Alt/Option + Up, moving your selection to the parent element instead, use Alt/Option + Down to reverse your selection.
  • Open the side panel to view the computed CSS of the currently selected element. Click the "Copy CSS" button to copy the computed CSS of the currently selected item to your clipboard.

Features

  • Measure the pixel size of any element.
  • Measure the pixel distance between any two elements.
  • HTML tag names, class names and IDs.
See more

User reviews

These summaries are automatically generated weekly using AI based on recent user reviews. Chrome Web Store does not verify user reviews, so some user reviews may be inaccurate, spammy, or outdated.
Pros
  • Fast performance
  • Clear UI
  • Excellent for measuring
  • Good design
  • Works as expected
Cons
  • Side panel does not open on many sites
  • Issues with the side panel on different browsers
  • Lacks a pause button next to exit/stop
  • Requires right-clicking for access on some sites
Most mentioned
  • Side panel issues
  • Positive UI/Design feedback
  • Overall effectiveness in measuring
  • User interest in pro version
Recent reviews

I can't open the side panel using the floating menu; I only need to click the extension's context menu. I'm using the latest version of Chrome; it happens on all the sites.
by Danny Feliz, 2024-09-24

by Lucas Anthony, 2024-09-15
View all user reviews

Extension safety

Risk impact

Screen Ruler - Measure The Web requires very minimum permissions.

Risk likelihood

Screen Ruler - Measure The Web has earned a fairly good reputation and likely can be trusted.

Upgrade to see risk analysis details

Promo images

Screen Ruler - Measure The Web small promo image
Small promo image

Similar extensions

Here are some Chrome extensions that are similar to Screen Ruler - Measure The Web: