Skip to content
Hover Debug Overlay

Hover Debug Overlay

by aman_lakhuja
5.0
1 reviews
19
users
Published
August 21, 2025

Screenshots

Hover Debug Overlay screenshot 1
Hover Debug Overlay screenshot 2
Hover Debug Overlay screenshot 3
Hover Debug Overlay screenshot 4

Description

The Hover Debug Overlay is a lightweight Chrome extension that helps developers and designers inspect web page elements quickly and visually. By simply hovering over an element, you’ll see a live overlay that highlights its boundaries (TOP, LEFT, RIGHT, BOTTOM) and optionally shows the element’s tag, ID, and classes — without disrupting the page layout. Features: - Live dimension overlay with edge labels (TOP/LEFT/RIGHT/BOTTOM) - Element descriptor (tag name, #id, .classes) - One-click enable/disable from the toolbar icon - Right-click to copy the element descriptor directly to your clipboard - Customizable: toggle element name and edge labels via context menu - Remembers your settings using local storage - No data collection, no remote requests, no analytics This extension is built with Manifest V3 and is completely self-contained. All functionality runs locally in your browser.
Add to Chrome

Quick Info

Version
1.1
Size
9.78KiB
Price
Free
Type
Extension

Categories

Languages

English (United States)