SCSS Mixin

Liquid Grid

Summary

A fast, minimal, and scalable SCSS mixin that generates a responsive grid in less than 2kb out of the box. It supports a single breakpoint for full width grids on mobile devices, helping to enforce a minimalist approach to responsive design.

View Git Repo
Fixed width columns
.col-12
.col-6
.col-6
.col-4
.col-4
.col-4
.col-3
.col-3
.col-3
.col-3
.col-3
.col-2
.col-2
.col-2
.col-2
.col-2
.col-2
.col-1
.col-1
.col-1
.col-1
.col-1
.col-1
.col-1
.col-1
.col-1
.col-1
.col-1
.col-1
Fluid width columns
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col
.col