Coding regular emails is hard enough by itself. Making them responsive and accessible shouldn’t add to the headache. A few simple, but solid patterns are all that’s needed to optimize emails for small screens and assistive technologies.
That’s what Cerberus is. It’s just a few email patterns that go a long way.
The code blocks are compartmentalized so they may be used, removed, combined, and nested to build an email. Each template is annotated with code comments explaining what’s happening so you can add, edit, and remove code with some confidence.
Here's an example of a button:
Cerberus is plain 'ol HTML and CSS, so it an be used in any framework or email service provider (ESP), though it's not written for any specific framework or ESP.
I wrote a blog post that goes into more detail on why I made this in the first place.
Email Client Support
Cerberus is tested in the most popular email clients as reported by Litmus and my own email campaigns. I’ve focused on the following clients:
- Outlook 2000/02/03/07/10/13/16/18 (Windows)
- Windows 10 Mail
- Outlook 2011/16 (Mac)
- Apple Mail 9/10
- iOS Mail (iPhone + iPad)
- Gmail (iOS + Android, all account types)
- Mail (Android 6.0)
- Yahoo (iOS)
- Outlook (iOS)
- Alto Mail (iOS)
- Web Browser
- Gmail (IMAP, GSuite)
- Office 365 Web
- Terra Mail
Any client not listed above should be considered untested. If you feel I’ve left out a popular email client or can suggest a non-destabilizing fix for one, please submit an issue!
For what it’s worth, Litmus (who does test every email client) includes Cerberus in its Email Builder, so there’s that.
If you would like to help, please @reply me on Twitter or open an issue to discuss your idea. I’m forever interested in reducing the entropy of this code. I’m most interested in:
- Fixing existing code that’s broken.
- Reducing the amount of code in existing patterns.
- Improving the documentation.
Please be mindful there are three templates that share a lot of code. Many changes apply to all three.
Please branch off the
main branch instead of
👋 I’m Ted Goas, the core author and maintainer. I’m a product designer & front-end developer with a soft spot for HTML emails. Some day I'd love to combine my professional craft and hobby to work on an email platform.
@tedgoas • tedgoas.com