MailMode Preview first. Panic less.
Docs Changelog About Status Terms Privacy
Docs

Quick Start

A short path from email source to useful preview output.

For the most accurate email previews, keep important layout and colour styles inline where possible.

1. Add your email

Paste HTML directly, upload an HTML/HTM file, upload MJML, upload a React Email JSX/TSX file, or drop in a supported ZIP project. ZIP projects can include one main email file plus local image assets.

2. Preview light and dark mode

MailMode renders light and dark previews automatically once content is available. Use Authored CSS to see your email’s own dark mode CSS, Partial Invert for selective darkening, or Full Invert for aggressive colour remapping.

3. Switch viewport widths

Use the viewport selector to test Mobile, Large Mobile, Tablet, Email Standard, Email Wide and Desktop. The same width is applied to both light and dark previews so comparisons stay consistent.

4. Review the health report

Start with the compact analysis summary. Open the full health report when you need the detailed checks for links, images, accessibility, tracking, subject/preheader copy and dark mode risks.

5. Create a shareable preview link

Use Create Shareable Link when you need someone else to review the rendered email. The hosted preview is public to anyone with the link and expires after 3 days.

6. Export a PDF report

Use the PDF export to download a branded report containing the current preview details, summary and useful warnings.

© 2026 MailMode. Docs for the current MVP. Docs · Changelog · Privacy · Terms