Support & Help

Getting Started

Site Layout Inspector makes it easy to visualize and understand website layouts:

• Click the extension icon in your toolbar
• Select which layers you want to inspect (Structural, Navigation, Content, etc.)
• Click the Activate button to start
• Hover over highlighted elements to see detailed information
• Click Export Layout JSON to save the structure

Features

• Structural Elements — Headers, footers, sections, navigation areas
• Layout Detection — Automatically finds CSS Grid and Flexbox containers
• Element Details — Hover over any overlay to see computed styles, dimensions, spacing
• Layout Export — Download a JSON file with complete structural analysis
• Real-time Redraw — Quickly refresh overlays after changes

Troubleshooting

• Extension won't activate: Try refreshing the page and clicking Activate again
• Overlays not visible: Ensure the layer checkboxes are selected
• Export creates empty file: Try clicking Redraw before exporting
• Strange behavior on some sites: Some sites may have complex CSS that affects overlay positioning — try adjusting layers

Reporting Issues

Found a bug or have a feature request? Please open an issue on GitHub:

github.com/AshGurprit/chrome-extensions/issues

When reporting issues, please include:

• The website where you encountered the issue
• What you were trying to do
• What you expected to happen
• What actually happened
• Your browser and operating system

FAQ

Does this extension collect my data? No, see our Privacy Policy for details.

Can I use this on all websites? Yes, the extension works on any website you visit.

Is there a cost? No, Site Layout Inspector is completely free.

Can I modify the export format? The JSON export provides complete structural data. You can parse and transform it as needed.