New: Over 100 Components to Jump Start Your Projects!

ZURB Email Stack

Power Tools for Email Development

The difference between a good developer and a great one is often efficiency. Build tools like Gulp and package managers like npm give you the tools to automate tasks and stay D.R.Y. In Foundation for Emails, the ZURB Email Stack provides you an all-in-one workflow for email development, from Sass to image compression to inlining.


Gulp

The Gulp build system automates your workflow by automatically processing Sass, email templates, and images as you work.

Inky HTML

The Inky templating language converts simple HTML tags into complex tables for you, making writing emails a breeze.

Sass

Use Sass to organize component CSS into partials, and customize the framework with a global settings file.

Inliner

You won't need our web inliner, as we include a full inlining process in the stack.

BrowserSync

A test server that live reloads pages as you change files. It also makes testing on external devices easier.

Image Compression

The stack automatically compresses images, so they'll load on bandwidth-restrained mobile devices faster.

ZURB MASTER CLASSResponsive Emails

In this online class, you’ll learn how to rapidly design and develop responsive emails that look beautiful on just about every screen, browser, and email client out there—even Outlook.

Learn Foundation for Emails

Inky + Panini

Write responsive emails with the least amount of HTML possible.

The Foundation for Emails CSS provides a battle-tested set of UI components that work in every major email client. But we wanted to make writing HTML emails even easier—why waste time with all those tables?

The ZURB Stack incorporates Inky, a new templating language that converts simple HTML tags like <row> and <columns> into the complex HTML tables required to make your email tick. This saves a ton of time in learning the framework and debugging annoying issues around incorrect HTML structure. Even better, if we ever make changes to the Foundation for Emails HTML to fix bugs, you get those fixes automatically—all you have to do is update Inky.

Along with Inky, you have another tool in your utility belt to tame the beast of HTML email: Panini. With Panini, you can define a common layout for all of your email templates. No cutting and pasting needed—just define your header and footer in one default layout, which is then injected into all of your emails. You can also use Handlebars partials to further organize HTML into reusable chunks, or use custom variables to make more dynamic email content.

The ZURB Email Stack ensures that your code is easy to write and even easier to maintain long-term.

Get Started with the ZURB Stack

Do Some Construction

Give your work a visual boost. Don't worry, we've got what you need.

HTML Templates

We’ve created templates to jump start your next Foundation project. These templates will help you build faster or get an idea for your next project's layout.

Build Faster →


Foundation Forum

The Foundation forum is a great place to get involved in discussions, get answers, and help someone out! Find helpful articles and tutorials there too!

Get in the Conversation →


GitHub

Report bugs or submit your own fixes through a pull request. Post helpful feedback on discussion threads. Resolve 10 issues, get a shirt!

See How to Contribute →


Twitter

We love it when you share the work you created, the tunes you listen to when coding with Foundation, or any other interesting tidbits.

Chat with us on Twitter →