Foundation

What's new in 4.0?

More flexible, more powerful and more full-featured than ever before.

What's new in 4.0?

More flexible, more powerful and more full-featured than ever before.

sass

Mobile First

Foundation is now Mobile First, meaning you start building for small devices first, then layer in more complexity as devices become larger and more powerful.

ZURB advisor Luke Wroblewski, author of "Mobile First", convinced us that the next iteration of Foundation needed to be mobile first, and we agreed (eventually). That means Foundation 4's base state is tailored to small devices, with limited layout control and simpler elements.

From there, you build your layout up. Layer in an even more powerful multi-device grid, retool how components display and function, and basically create an experience, which is great no matter where people view your site.




All Semantic

We've taken the semantic grid of Foundation 3 and applied that to almost everything. If you use the Sass version of Foundation, you can remove all of the presentational component classes you've had to use with other versions of Foundation.

We've created Sass mixins and extensions that let you (if you want to) write whatever markup is best and most semantic for your site, and then apply Foundation component styles to them entirely in the Scss.

No more column classes on divs, no more hard-coded tabs — Foundation 4 means that you can have the cleanest markup you'd like without sacrificing the utility and speed of Foundation.




All New JS

We rewrote all of our JS plugins (and even added some new toys) to make it faster, easier to call, and easier to add to.

We want the JS plugins for Foundation to be best in class, so we rewrote them all to polish them to a mirror shine. You can still use all the great plugins you're used to like Orbit, Reveal and Clearing but we've rebuilt them to be better, faster, and stronger. Like the Six Million Dollar Man, or Daft Punk.

We've also switched Foundation by default over to Zepto, a much lighter substitute for jQuery which is API-compatible with jQuery plugins, including ones you've written previously. If you need jQuery support, don't worry — you can swap it in for Zepto without breaking anything in Foundation.

Get Foundation Now →

Stay on top of what's happening in responsive design with Responsive from ZURB.

Sign up to receive monthly Responsive Reading highlights. Read Last Month's Edition »