Easily check the grid alignment of your page across breakpoints.
CSS Grid Overlay - Chrome Extension for Grid Alignment
'CSS Grid Overlay' is a Chrome extension, enabling developers to verify the grid alignment of their webpages across multiple breakpoints. It supports ordinary grid values such as gutters, columns, and max width. Configurations can be effortlessly saved and shared among team members as JSON objects. Thus, ensuring consistent design throughout.
Extension stats
Risk impact: Very low risk impact
Risk likelihood:
Manifest version: 3
Permissions:
Size: 185.34K
Email: im*****@gmail.com
URLs: Website
Ranking
# 9,799
Want to check extension ranking and stats more quickly for other Chrome extensions?
Install
Chrome-Stats extension
to view Chrome-Stats data as you browse the Chrome Web Store.
Extension summary
Supports multiples breakpoints and the usual grid values (gutters, columns, max width, etc).
Configurations can easily be saved and shared among team members as json objects.
Example conf:
[ { "columns": 4, "margins": 16, // px before and after the first and last column // these gutters work like margins: // if distance between columns is 32px, gutters are 16 "gutters": 16, "from": 0, // start of breakpoint in px // Optional values
See moreUser reviews
Love this! It's helping my dev and design teams align more easily. A doc page somewhere explaining the syntax would be helpful. But at least be sure to read the json example on the extension's page in the chrome store. Especially note that the gutter width parameter is HALF the full gutter width. I sometimes see the error that the JSON isn't valid, even though it passes in online linters. I refresh the extension's options page and then save it again--the error goes away.
Great for web developers! I tried few of similar extensions but this one is the best. I love being able to save multiple grid configs. ❤️️
great doing what it is supposed to do, very useful tool
Extension safety
Risk impact
CSS Grid Overlay does not require any sensitive permissions.
Risk likelihood
CSS Grid Overlay has earned a good reputation and can be trusted.
Upgrade to see risk analysis details
Similar extensions
Here are some Chrome extensions that are similar to CSS Grid Overlay:
Grid Builder Foundation Overlay Muzli - Design inspiration hub Responsive Viewer NOV Grid - Responsive grid overlay gridView Grid System Bootstrap Grid for any Website Grrrid CSS Peeper Grid Ruler Dimensions Inspect | Gridman
https://beltslib.net
3.45
767
Daniel Samuels
4.50
716
https://muz.li
4.51
400,000+
https://responsiveviewer.org
4.26
200,000+
Dennis Novriandi
5.00
728
https://www.medinnna.com
3.40
N/A
abdullahrafique565
5.00
3,000+
Tam Nguyen
4.71
4,000+
david marsalone
3.75
982
CSS Peeper
4.63
500,000+
tgohn
3.76
100,000+
https://fenvox.com
4.01
10,000+