Preview & Testing

Always preview and test your email before exporting. Email rendering varies across clients: what looks perfect in Chrome may break in Outlook.

Desktop preview

The canvas shows a live desktop preview as you build. What you see is close to what Gmail and Apple Mail will render.

Mobile preview

Click the mobile preview toggle to see how the email renders on a phone-sized screen:

  • Columns stack vertically
  • Images scale to fit
  • Buttons become full-width
  • Font sizes adjust for readability

Testing checklist

Before exporting, verify:

CheckWhat to look for
ImagesAll images load, correct sizes, alt text set
LinksAll buttons and text links point to correct URLs
ButtonsLarge enough to tap on mobile (44px+ height)
TextReadable font size (14px+ body), sufficient contrast
ColorsConsistent with brand, sufficient contrast ratios
LayoutDoesn't break on narrow screens
SpellingNo typos in headings, body, or CTA text
PreheaderFirst line of text is meaningful (shown in inbox preview)
Total sizeUnder 102KB HTML (Gmail clips larger emails)

Email client testing

ClientExpected rendering
Gmail (web)Excellent (close to preview)
Gmail (app)Good (minor spacing differences)
Apple MailExcellent (best email rendering)
Outlook 365Good (some CSS limitations)
Outlook desktopFair (uses Word engine, limited CSS)
Yahoo MailGood

Common issues

IssueFix
Images blockedSet alt text on all images; it shows when images are blocked
Layout breaks on OutlookUse table-based layouts, avoid CSS grid/flexbox
Fonts don't renderUse email-safe fonts (Arial, Helvetica, Georgia)
Button isn't clickableEnsure the <a> wraps the entire button, not just the text
Email clipped in GmailReduce HTML size below 102KB
Tip

Send yourself a test email via your email provider (SES, SendGrid) before sending to your list. What you see in the editor preview may differ from what arrives in your inbox.