CSS Grid Cheat Sheet: Build Any Layout in 2026
Complete CSS Grid reference: grid-template, fr units, areas, auto-fill, auto-fit, minmax, and responsive patterns.
Basic Grid
.grid {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n grid-template-rows: auto;\n gap: 1rem;\n}\n\n/* Responsive grid */\n.grid {\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n}Try It Free
Use our free online tool — 100% client-side, no data leaves your browser.
Open CSS Minifier