Overview
Visual structure inspector — see flex rows/columns, grid containers, gaps, and copy classes from any website.
Layout Inspector is a visual structure inspector for frontend developers, UI engineers, and web designers. It helps you understand the layout of any webpage by highlighting flex rows, flex columns, grid containers, block elements, spacing, sizes, and DOM structure directly on the page. Instead of manually checking styles in DevTools, Layout Inspector gives you a fast visual overview of how a page is built. Key features: • Detect flex and grid layouts visually • Highlight layout structure directly on the webpage • Inspect spacing, gaps, padding, and element sizes • View a structured DOM tree for selected elements • Copy classes, Tailwind-style spacing hints, selectors, or summaries • Export the inspected structure as JSON • Use Alt + Shift + I to quickly toggle the inspector • Works locally in your browser without sending data to external servers Layout Inspector is useful for debugging layouts, reviewing UI structure, understanding unfamiliar pages, improving responsive designs, and inspecting modern web interfaces faster. The extension only runs when you activate it. It processes layout information locally in the browser and does not collect, store, or transmit personal data.
Details
- Version2.1.0
- UpdatedJuly 21, 2026
- Offered byamroahmed109
- Size49.44KiB
- LanguagesEnglish
- Developer
Email
amr.ahmed@envnt.co - Non-traderThis developer has not identified itself as a trader. For consumers in the European Union, please note that consumer rights do not apply to contracts between you and this developer.
Privacy
This developer declares that your data is
- Not being sold to third parties, outside of the approved use cases
- Not being used or transferred for purposes that are unrelated to the item's core functionality
- Not being used or transferred to determine creditworthiness or for lending purposes
