Two Ways to Get Started
Foundation for Emails can be used with plain CSS or Sass.
CSS Version
The fastest way to get started! The CSS version of Foundation for Emails has everything you need and nothing you don't to get started writing responsive HTML emails. You get our boilerplate HTML, our starter email templates, and the battle-tested Foundation for Emails CSS.
Download Starter Kit
These are the files you'll use in the Getting Started guide.
Sass Version
Streamline your workflow even more. The Sass version of Foundation for Emails gives you greater control over the visual styles of the framework. It's also backed by the ZURB Stack, a Node-powered build system with HTML templating, Sass compilation, image compression, and inlining. Requires Node.js to get started.
View Template Files
This is the project template you'll use in the Getting Started guide.
Looking for Ink 1.0?
Ink 1.0 is no longer maintained by ZURB, but we've still got all of the files you need to use it, as well as the documentation. Or, if you want to upgrade your project to Foundation for Emails 2, check out our migration guide.
MASTER CLASSfor Responsive 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 EmailsFive steps to Foundation for Emails-certified emails
Follow these five steps to make sure your email looks great.
Download the boilerplate
Download our basic boilerplate with the Foundation CSS. Or, if you're a Sass user, install the ZURB Email Stack with the Foundation CLI.
Code your email
Use the documentation to build out your grid, adding components like buttons and callouts where needed. If you're just getting started, follow our CSS version guide or Sass version guide.
Inline CSS into HTML
Once your email looks great and responsive styles are included, inline your CSS into the email. Our web inliner makes this easy. Or, if you're using the ZURB Email Stack, just run npm run build
.
Test your email
Don’t send it out just yet! Make sure you test it on as many platforms as you can. We use Litmus to test on a number of devices—you should too!
For a list of supported clients, check out our compatibility page in the docs.
Send it out!
Your email is ready to ship! We recommend using an email service provider like Mailchimp or Campaign Monitor, since some mail clients strip out the responsive formatting when you send an email.
Have a great email? Send a copy to us at contact@get.foundation.