HTML Email Template Preview
Preview HTML email templates in desktop (600px) and mobile (375px) views. Replace {{variables}} with test values, simulate a Gmail-style chrome, and toggle dark mode. 3 sample templates included.
Template Variables
{{name}}HTML Email Tips
- • Use inline styles — most email clients strip <style> blocks
- • Table-based layouts for consistent cross-client rendering
- • Keep width ≤ 600px for desktop, fluid on mobile
- • Use web-safe fonts or include @font-face with fallbacks
- • Always include a plain-text version in your ESP
- • Use absolute URLs for images (no relative paths)
- • Test in Gmail, Outlook, Apple Mail, and mobile clients
- • Avoid JavaScript — email clients block it
Frequently Asked Questions
How does the email preview work?
The preview renders your HTML inside a sandboxed iframe using the srcdoc attribute. This is safe and does not make any network requests or execute JavaScript. You can see exactly how your HTML renders in a browser engine, which closely approximates how most email clients display HTML.
How do template variables work?
Template variables use double-brace syntax like {{name}} or {{order_id}}. The tool automatically detects all variables in your HTML and shows input fields to fill in test values. The preview updates live as you type, letting you see exactly how personalized emails will look for different recipients.
Why do I need inline styles for HTML emails?
Most email clients (especially Gmail, Outlook, and Yahoo Mail) strip <style> blocks or ignore external stylesheets. Inline styles (style='color: #333; font-size: 16px;') are the most reliable way to ensure your design looks consistent across email clients. Always test in multiple clients before sending.
What is the recommended width for HTML emails?
600px is the standard maximum width for the email body. This fits in most desktop email client preview panes. On mobile, use fluid/percentage widths inside your 600px container so the email adapts to 375px screens. The tool provides both desktop (600px) and mobile (375px) preview modes.