Product Hunt logo dark
  • Launches
    Coming soon
    Upcoming launches to watch
    Launch archive
    Most-loved launches by the community
    Launch Guide
    Checklists and pro tips for launching
  • Products
  • News
    Newsletter
    The best of Product Hunt, every day
    Stories
    Tech news, interviews, and tips from makers
    Changelog
    New Product Hunt features and releases
  • Forums
    Forums
    Ask questions, find support, and connect
    Streaks
    The most active community members
    Events
    Meet others online and in-person
  • Advertise
Subscribe
Sign in
Subscribe
Sign in
Screen Ruler

Screen Ruler

Measure the Web

185 followers

Measure the Web

185 followers

Visit website
Chrome Extensions
•
Design resources
•
UI frameworks
Screen Ruler is the perfect companion for web developers and designers. See sizes, distances, margins and paddings of any element on any web page.
  • Overview
  • Launches1
  • Reviews
  • Team
  • Awards
  • More
Company Info
chromewebstore.google.com/detail/screen-ruler-measure-the/jfbbgijjljfbolelfkopkhbfjajjampm
Screen Ruler Info
Launched in 2024View 1 launch
Forum
p/screen-ruler
  • Blog
  • •
  • Newsletter
  • •
  • Questions
  • •
  • Forums
  • •
  • Product Categories
  • •
  • Apps
  • •
  • About
  • •
  • FAQ
  • •
  • Terms
  • •
  • Privacy and Cookies
  • •
  • X.com
  • •
  • Facebook
  • •
  • Instagram
  • •
  • LinkedIn
  • •
  • YouTube
  • •
  • Advertise
© 2025 Product Hunt
Screen Ruler gallery image
Screen Ruler gallery image
Screen Ruler gallery image
Screen Ruler gallery image
Screen Ruler gallery image
Free Options
Launch tags:
Chrome Extensions•Design Tools•Developer Tools
Launch Team / Built With
Myster Violets
ExtensionPay
Google Chrome
Zed

What do you think? …

Myster Violets
Myster Violets
Screen Ruler

Screen Ruler

Maker
📌
Hi Product Hunt, I'm excited to introduce Screen Ruler 2.0, the ultimate tool for web developers and designers. Screen Ruler is designed to streamline your workflow by providing precise measurements and detailed insights into your web elements. Once activated, simply hover over any element to view its sizes, margins, paddings, tag names, IDs, and classes. Key Features: - Measure the pixel size of any element. - Calculate the pixel distance between any two elements. - Display HTML tag names, class names, and IDs. - Use shortcuts for parent/child selection. - Responsive selections adjust with your browser window. - Access from the context menu. - Inspect computed CSS properties. - Copy CSS to clipboard effortlessly. - Document outline reveals parent and child elements for easy navigation. - Works seamlessly on any web page. Screen Ruler PRO: Upgrade to Screen Ruler PRO for a one-time payment and unlock a suite of advanced features: - Element Inspection: View detailed properties, including position, size, rendered font, and colors, by simply moving your mouse over an element. - Layout Grid: Overlay a layout grid on your site to ensure design alignment. - Screenshot Capture: Capture screenshots of highlighted areas with a click or using the Ctrl/Command + Shift + S shortcut. Ideal for documentation or attaching to Github tickets. - Advanced Properties Panel: Access a comprehensive side panel showing advanced properties like the element's box model, selection colors, and more. - Asset Management: Get a list of all image and SVG assets within your selection and download them individually or all at once. Join me in making web development and design more efficient and precise with Screen Ruler.
Report
1yr ago
Kyrylo Silin
Kyrylo Silin
Telebugs

Telebugs

Hey, I can finally put my ruler in the drawer, thank you 😆 I'm curious about how it handles elements with complex layering or overlapping. Does it provide accurate measurements in those cases? Are there any plans to add features for comparing measurements across different screen sizes or devices? Congrats on the launch!
Report
12mo ago
Kyrylo Silin
Kyrylo Silin
Telebugs

Telebugs

In other news, do you have an X account? I would love to support your launch
Report
12mo ago
Govi Chan
Govi Chan
Congrats on the launch, @myster_violets! My friend is a designer, Screen Ruler would be super handy for him. I’ll definitely recommend it!
Report
12mo ago
AWS Builder Center
AWS Builder Center — Learn, build, and connect with builders in the AWS community
Learn, build, and connect with builders in the AWS community
Promoted

Do you use Screen Ruler?

Reviews
Helpful
Review Screen Ruler?Be the first to review Screen Ruler