GridLens for Bootstrap de chadacreatives
A developer tool for working with Bootstrap. Overlay the 12-column grid, watch the breakpoint change as you resize, reveal every tooltip at once, and open any component without hunting for its trigger. Works with Bootstrap 3, 4, and 5.
Metadate extensie
Despre această extensie
GridLens is a developer tool for building and debugging Bootstrap layouts. It puts
a handful of things a click away that otherwise mean digging through DevTools.
GRID OVERLAY
Draw the 12-column grid over any Bootstrap page and see exactly where your
columns fall. The overlay appears only where Bootstrap is actually in use, so
it never follows you onto unrelated sites.
The overlay reproduces Bootstrap's real container geometry - the correct
max-width and gutter for each breakpoint, matched to whichever major version
the page uses - so it lines up with your actual columns instead of
approximating them. Switch between .container and .container-fluid. Pick any
overlay colour. A floating readout shows the active breakpoint and the current
viewport width, updating live as you resize.
VERSION DETECTION
Detection runs in the page's own JavaScript context rather than guessing from
markup, so it reports the exact version the page loaded - 5.3.3 rather than
just "Bootstrap 5". It recognises pages that load Bootstrap's CSS without its
JavaScript, and re-checks when Bootstrap arrives late.
TOOLTIP VIEWER
Reveal every Bootstrap tooltip on the page at once, instead of hovering each
element one at a time to check copy, positioning, and overflow. Detects whether
the page runs Bootstrap 3, 4, or 5, with a manual override when you need it.
COMPONENT OPENER
Lists every Bootstrap component on the page — modals, offcanvas panels, toasts,
dropdowns, tabs, accordions, carousels and popovers — and opens the one you
pick. No need to find the button that triggers it, or to fake application state
to reach it. Components with no trigger anywhere on the page are listed too.
CUSTOM BREAKPOINTS
Ships with Bootstrap's defaults (xs, sm, md, lg, xl, xxl). If your project
overrides them, define your own: a breakpoint is just a name and the width it
starts at, so ranges are worked out for you and cannot end up with gaps or
overlaps. Export a set as JSON to share it across a team, or paste one in -
including the plain name-to-width map you can lift straight out of a project's
Sass.
PRIVACY
No analytics, no telemetry, no accounts, no servers. GridLens sends nothing
anywhere. Your settings are saved in your browser's own extension storage and nowhere else. Full policy: https://christian-codez.github.io/gridlens-for-bootstrap/privacy/
GridLens is an independent project. It is not affiliated with, endorsed by, or
sponsored by the Bootstrap project or its maintainers.
a handful of things a click away that otherwise mean digging through DevTools.
GRID OVERLAY
Draw the 12-column grid over any Bootstrap page and see exactly where your
columns fall. The overlay appears only where Bootstrap is actually in use, so
it never follows you onto unrelated sites.
The overlay reproduces Bootstrap's real container geometry - the correct
max-width and gutter for each breakpoint, matched to whichever major version
the page uses - so it lines up with your actual columns instead of
approximating them. Switch between .container and .container-fluid. Pick any
overlay colour. A floating readout shows the active breakpoint and the current
viewport width, updating live as you resize.
VERSION DETECTION
Detection runs in the page's own JavaScript context rather than guessing from
markup, so it reports the exact version the page loaded - 5.3.3 rather than
just "Bootstrap 5". It recognises pages that load Bootstrap's CSS without its
JavaScript, and re-checks when Bootstrap arrives late.
TOOLTIP VIEWER
Reveal every Bootstrap tooltip on the page at once, instead of hovering each
element one at a time to check copy, positioning, and overflow. Detects whether
the page runs Bootstrap 3, 4, or 5, with a manual override when you need it.
COMPONENT OPENER
Lists every Bootstrap component on the page — modals, offcanvas panels, toasts,
dropdowns, tabs, accordions, carousels and popovers — and opens the one you
pick. No need to find the button that triggers it, or to fake application state
to reach it. Components with no trigger anywhere on the page are listed too.
CUSTOM BREAKPOINTS
Ships with Bootstrap's defaults (xs, sm, md, lg, xl, xxl). If your project
overrides them, define your own: a breakpoint is just a name and the width it
starts at, so ranges are worked out for you and cannot end up with gaps or
overlaps. Export a set as JSON to share it across a team, or paste one in -
including the plain name-to-width map you can lift straight out of a project's
Sass.
PRIVACY
No analytics, no telemetry, no accounts, no servers. GridLens sends nothing
anywhere. Your settings are saved in your browser's own extension storage and nowhere else. Full policy: https://christian-codez.github.io/gridlens-for-bootstrap/privacy/
GridLens is an independent project. It is not affiliated with, endorsed by, or
sponsored by the Bootstrap project or its maintainers.
Evaluat cu 0 de către 0 recenzori
Permisiuni și date
Permisiuni necesare:
- Să îți acceseze datele pentru toate site-urile web
Colectare de date:
- Dezvoltatorul spune că extensia nu necesită colectarea de date.
Mai multe informații
- Linkurile suplimentului
- Versiune
- 1.10.0
- Mărime
- 58,07 KB
- Ultima actualizare
- 15 zile în urmă (20 aug. 2026)
- Categorii conexe
- Licență
- Licență MIT
- Politică de confidențialitate
- Citește politica de confidențialitate pentru acest supliment
- Istoricul versiunilor
- Adaugă în colecție