gem install susy

Your markup. Your design. Our math.

The web is a responsive place, from your lithe & lively development process to your end-user's super-tablet-multi-magic-lap-phone. You need grids that are powerful yet custom, reliable yet responsive.

Recent News:

10-column complex nested grid AG test

ag1 2 of 10

ag2 6 of 10

ag4 3 of 6

ag5 3 of 6 (omega)

ag6 2 of 6

ag7 4 of 6 (omega)

ag8 2 of 4

ag9 2 of 4 (omega)

ag10 auto

ag3 2 of 10 (omega)

:::scss // Complex AG grid, brought to you by Susy: .ag1 { @include span-columns(2,10); } .ag2 { @include span-columns(6,10); } .ag3 { @include span-columns(2 omega, 10); } .ag4 { @include span-columns(3,6); } .ag5 { @include span-columns(3 omega,6); } .ag6 { @include span-columns(2,6); } .ag7 { @include span-columns(4 omega,6); } .ag8 { @include span-columns(2,4); } .ag9 { @include span-columns(2 omega,4); } .ag10 { clear: both; }

We're just getting warmed up.

Quickly add media-query breakpoints for new layouts with at-breakpoint, or create your own custom math using Susy's full array of grid helpers. Build a one-off site in minutes, or create your own scalable object-oriented grid library for large projects.

Susy provides the power-tools, what you build is up to you.