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.
Short Transactional
Great for emails with a single message like “Forgot password”, “You’ve been removed from a Team”, or “Cart abandonment”.
Long Transactional
For complex emails that could contain multiple messages like “Your answer was accepted”, “New Interests”, or “Tag digest”.
Promotional
Major announcements worthy of grabbing attention or celebrating like “Announcing Teams”, “Welcome to Talent”, or “You’ve asked your first question”.
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, team identification, 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.
FAQ
We’ve answered a few common questions, like:
Email client breakdown
Make sure your emails render well in these clients. We use Litmus and a few other tools.