Email design at Stack Overflow

An email design system that helps us work together to create consistently-designed, properly-rendered email for all Stack Overflow users. Intended for anyone who works with email at Stack Overflow.

Templates

Starting points for creating new emails.

Customizing email

Design and code guidelines for how we create and customize emails.

Base

Design patterns for basic things like typography, hyperlinks, responsiveness, Outlook conditional CSS, and more.

Components

Design patterns for more complex things like buttons, images, tags, responsive columns, and more.

Knowledge and resources

Design best practices

Emails don’t need to look the same in every email client, but there are some things to keep in mind when working on emails.

View design best practices

Email client breakdown

Make sure your emails render well in these clients. We use Litmus and a few other tools.

Gmail
73%
Yahoo
8%
Apple Mail
6%
Microsoft Outlook
5%
iPhone
5%
Windows Live Mail
1%
iPad
< 1%
Samsung Mail
< 1%
Android Mail
< 1%
Mail.Ru
< 1%
Deploys by Netlify