Bootstrap Grid Overlay - Web Layout Tool

About

Bootstrap Grid Overlay - Web Layout Tool

Visualize, align, and perfect your web layouts instantly!

Bootstrap Grid Overlay is a must-have Chrome extension for web developers and designers. It allows you to quickly toggle a fully customizable, responsive 12-column grid overlay on any webpage you are working on. Whether you are building a new site or debugging an existing layout, this tool ensures your elements align perfectly with standard design systems.

Key Features:
- Instant Toggle: Turn the grid overlay on or off with a single click from the extension popup.
- Fluid & Fixed Containers: Seamlessly switch between standard Bootstrap container max-widths and a 100% width fluid container.
- Customizable Opacity: Adjust the visibility of the grid columns using a simple slider to match your contrast needs.
- Live Breakpoint Indicator: See your current screen width and the active Bootstrap breakpoint (xs, sm, md, lg, xl, xxl) at a glance.
- Non-Intrusive Design: The grid is fully click-through, allowing you to interact with your webpage and use Chrome DevTools without any interruptions.

Perfect for pixel-perfect alignment and responsive web design debugging. Add Bootstrap Grid Overlay to your workflow today!