What email width should I design for?

The standard email width is 600px for desktop. Most email clients render at this width. For mobile, design for 375px width. Use responsive CSS or media queries to handle both.

Does this tool show rendering differences between email clients?

This tool shows a web-based preview. For testing across email clients (Gmail, Outlook, Apple Mail), you'll need to send test emails. This tool is great for quick HTML validation and layout checking.

What HTML is supported in emails?

Email HTML is limited compared to web HTML. Use tables for layout, inline CSS for styling, and avoid JavaScript. Most email clients support basic CSS but not CSS Grid, Flexbox, or modern features.

Can I use CSS media queries?

Some email clients support media queries (Apple Mail, iOS Mail, Gmail app), but Outlook and some webmail clients do not. Use a mobile-first approach with media queries as progressive enhancement.

HTML Email Previewer

Preview your HTML email template in desktop and mobile views. Paste your HTML and see exactly how your email will look.

Fast & Free Privacy-First No Sign-up Required

HTML Email Code

<!DOCTYPE html>
<html>
<head>
  <style>
    body { font-family: Arial, sans-serif; margin: 0; padding: 0; background: #f4f4f4; }
    .container { max-width: 600px; margin: 0 auto; background: #ffffff; }
    .header { background: #1a1a1a; color: #ffffff; padding: 24px; text-align: center; }
    .content { padding: 24px; }
    .button { display: inline-block; background: #2563eb; color: #ffffff; padding: 12px 24px; text-decoration: none; border-radius: 6px; }
    .footer { padding: 16px 24px; text-align: center; color: #666; font-size: 12px; }
  </style>
</head>
<body>
  <div class="container">
    <div class="header">
      <h1 style="margin:0;">Welcome to AISend</h1>
    </div>
    <div class="content">
      <p>Hi there,</p>
      <p>Thanks for signing up! Your API key is ready.</p>
      <p style="text-align:center;margin:24px 0;">
        <a href="#" class="button">View Dashboard</a>
      </p>
    </div>
    <div class="footer">
      <p>&copy; 2026 AISend. All rights reserved.</p>
    </div>
  </div>
</body>
</html>

Preview

This preview shows how your email renders in a web browser. Actual rendering may vary across email clients (Gmail, Outlook, Apple Mail).

Frequently Asked Questions

Related Tools

View All Tools →

Send Emails with AI

AISend uses AI to optimize deliverability, route across providers, and generate templates. 1,000 emails/month free.

Try AISend Free