Foundation 5 Blasts Off!

wrote this on in . 224 reactions

It's here.

We're thrilled to announce that Foundation 5.0 is available today for you to download. Foundation 4.0 rolled out nine months ago, and since then we haven't sat idle. We've been making steady improvements, culminating in the fastest, most efficient, and most advanced responsive CSS framework ever.

Yetis in spaaaace!

We can talk about mobile first, and the merits (or folly) of designing in the browser. But one factor has stayed constant since the beginning of the web: speed matters. Users abandon sluggish sites. Milliseconds cost Amazon millions. And we've heard it from our clients: when designing better products, performance is a priority.

To help you make products that don't leave people hanging, we've taken that priority to heart. Everything about Foundation 5 was tweaked — or rebuilt — for speed. Some turbo-charged examples:

Faster for Users

Interchange, our responsive image solution, is now a formal part of Foundation 5. But Interchange itself has a new feature: You can now use any kind of content, which means browsers download images, CSS and other content, appropriate for their device type. Create different HTML partials and have Interchange swap them in for the right type of device.

Another boon to users: Off-canvas navigation is now a core part of Foundation 5's options. This new component provides a powerful way to build navigation into screens — and all the animations are built with CSS.

We switched to Zepto (with a jQuery option) in Foundation 4 for its smaller file size and faster load time. But faster downloads didn't always translate to better performance, so Foundation 5 uses jQuery 2. Foundation 5 also integrates fastclick.js so your mobile users have a snappier experience.

We've also added a ton of support for hardware acceleration, which allows for smoother animations and transitions, and deprecated some older selectors now that we've moved away from IE8 as well.

Faster to Code

If you need a booster rocket, we've created shiny new templates to jump start your next Foundation 5 project.

We've built a new command line tool that will let you spin up Foundation projects preposterously fast, and those projects will now use Libsass, a back-end Sass compiling library that will dramatically speed up how long it takes for your SCSS changes by 5x. This has already created amazing results; one early adopter saw a 32x performance increase in compile times. Type "foundation new project-name" and you're go for throttle up.

As if that wasn't enough, we've started to use Bower, the popular upgrade manager, to make Foundation upgrades more efficient and easier to carry out.

Sublime users, rejoice: We're offering a Sublime package to automatically help you scaffold new components in your project. Meanwhile, designers should be pleased to note that our styles are still lightweight and easy to override — Foundation is a starting point on which you design websites, after all. But it does have formatted components, some of which which we've upgraded with cleaner visuals that look great out of the box.

We introduced a medium grid size in Foundation 4.3. Fit in between its small-# and large-# counterparts, you can also use medium-# range in the block grid, offset classes, and visibility classes.

Finally, enterprise users can now rely on Foundation Business, which will provide professional support, consulting, tools and training for all your company projects. Foundation is the professional choice for designers and engineers.

Faster to Learn

We've revamped the documentation so you can quickly learn the inner workings of Foundation from the start. There are new and more detailed code examples with entirely new sections. We also wrote a new "Getting Started" guide that'll help you chart a course and have a complete Foundation environment to build or hack on.

But that's just the launchpad. Our growing, helpful, Foundation-savvy team comes in addition to a new Foundation forum dedicated for questions, answers and dialogue with the design community.

It's taken a long time to get things right, but we think Foundation 5's improved performance and new features were worth the wait. The countdown to Foundation 5 is over. We have liftoff!

Download Foundation 5

Container queries 2
Foundation & CSS Grid: Think Beyond the Page
Building blocks graphic
Foundation Building Blocks: Over 100 Components to Jump Start Your Projects
Screen shot 2017 05 16 at 2.54.30 pm
The New Foundation Docs: Learn Your Way