Media
3 items
Description
Explode any webpage's DOM into a 3D exploded view. Click the icon, then pick an element. Strata turns any webpage into an interactive design-review canvas. Click the extension icon, select an element, and inspect its DOM structure in two visual modes: • Inspect mode reconstructs the interface on a clean canvas and reveals spacing, box-model values, layout, typography, colors, shadows, and other CSS properties. • 3D mode separates nested DOM layers into an exploded view, making structure, hierarchy, hidden elements, and overlapping containers easier to understand. Strata also provides: • A Figma-style layers tree • Click and hover synchronization between the canvas and layer tree • Padding and margin visualization • CSS variable and design-token lookup • Hardcoded color detection • Agent-ready element locators that can be copied into AI coding tools • Screenshot export • Experimental Three.js scene inspection on compatible pages Strata is useful for frontend developers, designers, design engineers, and anyone reviewing or debugging a live interface. How to use: 1. Open the webpage you want to inspect. 2. Click the Strata extension icon. 3. Select an element on the page. 4. Explore it in Inspect or 3D mode. 5. Press Esc to close Strata. Strata analyzes the current page only after you activate the extension. It uses Chrome’s activeTab and scripting permissions to create the inspection view.