110 px wide on white
H1 (Headline large)
|42 px/48 px||Arial Regular/Bold|
H2 (Headline small)
|34 px/38 px||Arial Regular/Bold|
H3 (Subhead/Section head)
|26 px/30 px||Arial Regular/Bold|
H4 (Content header)
|18 px/22 px||Arial Regular/Bold|
|16 px/20 px||Arial Regular/Bold|
|8 px/10 px||Arial Regular/Bold|
Footer background color
Gray background/sectional background
2 columns with 40 px gutter
- 600 px, with 40 px margin on left and right
- Mobile: 20 px margin
Call to action (CTA)
- Use preset for CTA buttons.
- Active state is optional for desktop because hover state is not available on mobile devices; the active state is required on mobile.
- Primary, #D8292F
- Hover/rollover, #A61E22
- 240 px width (max 280) x 44 px height
- 18 point Arial Bold
- Text centered horizontally/vertically
- 4 px corner radius
- Box-shadow 3 px #97999B
- CTA should include the name of the offer, even in short form (e.g., “Get the guide”).
- Try to avoid generic terms like “Submit” or “Download.”
- Word count: 5 maximum; character count: 25 maximum.
- Small instructional icons: use Font Awesome. Use for social icons, small arrow indicators, and other smaller related iconography within body copy.
- Use provided video play button.
Single message (conversion focused)
Best used for announcements about new products, special offers, or other singular news items that feature a single call to action (CTA).
This email has a modular design, so you can add and subtract modules as needed. The top featured module has to stay on top; then you can use any number of modules in any order you wish.
- Write short, active subject lines that convey a benefit or incentive to your audience (60 characters).
- Include pre-header text, with a focus on the first 5–8 words for mobile readability.
- Communicate 1 single message, with 1 CTA.
- No more than 300 words; be concise and focus on the value proposition to the reader.
- Include social media links.
Depending on your content needs, choose the appropriate design to use.
- Content should be stacked from left to right.
- CTA should be featured without scrolling.
- Only hide content on mobile if the scrolling takes away from the experience.
- Multiple containers may be featured on a horizontal side swipe.