Design Grid Overlay
Extension Delisted
This extension is no longer available in the official store. Delisted on 2025-09-15.
This extension displays grid and measurement overlays for a design grid system. It is configurable to fit many design scenarios
Using a design grid is an established way to create visual harmony and rhythm across an entire piece of visual media, especially a website. This design grid plugin can be configured to work with many popular grid systems including Bootstrap, Skin, Pure, Susy, Foundation, and many more.
This extension lets you enter a grid specification of columns, gutters, and widths, and then display grid guides and element measurements to align the content on your page.
v1.0.1 - bug fix for grid settings
v1.0.0 - Added keyboard shortcuts. Added the ability to use shift + click or shift + up/down to adjust values by 10 instead of 1.
v0.5.2 - Added horizontal lines
v0.5.1 - Fixed bug where the large Grid toggle button was not clickable after a recent Chrome browser update.
v0.5.0 - Added Content Width Labels in the Report tab, which show the content width (inner width, without borders or padding) of any elements using a CSS selector. This feature can be useful in customizing your CSS media queries and grid-aligned containers to ensure proper minimum and maximum sizing, regardless of screen size.
Latest reviews
Very helpful in making grids. I wish something like this would exist for Firefox.
+ Работает на локальном сервере
very userful!! Thank you!
Can't get it to show the grid.
Exactly what I need. Thank you!
Super!
Makes online graphic design layout SO much easier. I wish I could just change it to black grid lines with a size bar to switch between, but beggars can't be choosers! Saved me so many headaches!
Vey good. It would be improved if there was an option to add more break points. "Large" and "small" are just not enough
It's not working at all, I have done all things like deleted browser cache, etc. It's not opening the grid layout :( earlier it was working fine, but I don't know what's wrong now.
This extension is the best in its class. Big thanks for developers!
Very nice plugin, would be perfect if can save/load settings, or export/import
Can't configure grid units. I have no idea what unit it's using. "grid inner" "grid outer" what does that mean? is that main grid lines and sub grid lines? I got the impression from the name that this would be like putting a graph paper grid on a webpage, but no, that's not what this seems to do..
Very useful
Really useful, did exactly what I needed when calculating distance between elements, and how much space to add. Handy 1-step responsive options too.
Great!
Love it!!!!!!
Wonderful plugin, so useful!
The best grid extension by far. Would like an option to have lines instead of planes.
