MailMode Preview first. Panic less.
Docs Learn Changelog About Status Terms Privacy
← Back to Docs
Docs

MJML

MailMode supports MJML uploads and pasted MJML so you can preview rendered email output in light and dark mode.

MJML Upload and Render Support

Paste MJML, upload an .mjml file, or include an MJML file in a ZIP project. MailMode currently uses the MJML 5.4.1 browser compiler before previewing and running checks. Compiler upgrades can change generated HTML, so compare important templates after a version change.

Useful MJML Metadata

MailMode detects mj-title for subject/title checks and mj-preview for preheader checks when those tags are present.

Supported Tags

Common MJML email structure such as mjml, mj-head, mj-title, mj-preview, mj-body, mj-section, mj-column, mj-text, mj-image, mj-button, mj-wrapper and mj-accordion should work through the available renderer. MailMode’s regression fixture compiles authored dark CSS and an accordion together so future compiler changes cannot silently remove either path.

Common Rendering Issues

The browser compiler cannot resolve mj-include, project-level .mjmlconfig custom components or build-time plugins. Render those projects in your own MJML build and paste or upload the resulting HTML for the closest production comparison. If pasted scripts appear after the closing mjml tag, MailMode ignores that trailing content for validation.

Dark Mode MJML Best Practices

Keep important colours explicit. Add dark mode CSS in mj-style where needed. Avoid white nested cards without dark equivalents. Test CTA buttons, logos and background wrappers in Authored CSS, Partial Invert and Full Invert modes. For deeper client-specific techniques, read the MJML dark mode guide.

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