Adds colorful outlines to all DOM elements for easy page structure visualization and debugging.
Users
45
+1 in 30 days
Rating
5.0 / 5
unchanged in 30 days
Ratings
8
0 in 30 days
Store rank
#113K
#94K among extensions
Version
0.0.3
updated 27 Jul 2025
Users
monthly, 3 years
Latest, 16 Oct 2026:45 usersMove the mouse over the chart for any month
Ratings count
monthly, 3 years
Latest, 16 Oct 2026:8 ratingsMove the mouse over the chart for any month
The Chrome Web Store rounds user counts down to the leading digit, so the user line moves in steps. The ratings count is exact and is the better signal of real adoption.
About Diver
Instantly visualize DOM structure with colorful element outlines
Diver reveals the hidden architecture of any webpage with one click. Transform complex layouts into clear, color-coded visual maps perfect for developers, designers, and QA engineers debugging CSS and understanding page structure.
Key features:
• One-click activation toggles colorful outlines for all DOM elements
• Cross-frame support works inside iframes and embedded content
• Zero performance impact with lightweight logics
• Visual feedback with clear ON/OFF badge
• Universal compatibility works on any website or framework
Why developers choose Diver:
• Debug layout issues instantly - spot overlapping elements and positioning conflicts
• Understand complex CSS - see nested divs, flexbox containers, and grid layouts
• Speed up development - no more inspecting elements one by one
• Test responsive designs - identify how components break across screen sizes
• Onboard faster - new team members understand codebases visually
Perfect for:
- Frontend developers debugging CSS layouts
- UI/UX designers reviewing implementation accuracy
- QA engineers testing responsive behavior
- Students learning web development
- Anyone reverse-engineering web structures
Transform complex web pages into clear visual blueprints.