The 4px Grid system is a fully responsive, robust, 12 column layout system with six default breakpoints and predefined tokens.
Grid is the very first CSS module created specifically to solve the layout problems we’ve all been hacking our way around for as long as we’ve been making interfaces.
Our grid is built with CSS Grid in its structural level to layout and align content. If you’re new to CSS Grid, this CSS Tricks CSS Grid guide will provide more detail around everything from basic terminology to code.
Flexbox is also a very great layout tool, but its one-directional flow has different use cases — this is why we use it inside the grid's children — and they actually work together quite well!
Get started with
Get started with GitHub
Get started with CSS & Tokens
Use these predefined classes and Tokens, request new classes and/or suggest according to BEM and Token naming spreadsheet
