Lead Management
Leads
Templates
Send Emails
Received Emails
Email Client
View All Emails
Automation
Edit Email Template
Template Title
Email Subject
Email HTML Code
(this is the code you will send — inline CSS included!)
Render Preview
Copy HTML
<!doctype html> <html lang="en"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Awesome Email</title> <style> /* EMAIL-SAFE INLINE STYLES: keep simple and table-based for best compatibility */ body{margin:0;padding:0;background:#f3f6fb} .email-wrapper{width:100%;background:#f3f6fb;padding:24px 0} .email-body{max-width:680px;margin:0 auto;background:#ffffff;border-radius:12px;overflow:hidden} .header{background:linear-gradient(90deg,#0f62fe,#7c3aed);padding:24px;text-align:center;color:#fff} .logo{font-size:22px;font-weight:700} .hero{padding:28px;text-align:left} .h1{font-size:22px;margin:0 0 10px;color:#0f1724} .p{margin:0 0 16px;color:#374151;font-size:15px;line-height:1.5} .cta{display:inline-block;padding:12px 18px;background:#0f62fe;color:#fff;border-radius:8px;text-decoration:none;font-weight:600} .features{display:flex;gap:12px;padding:18px;border-top:1px solid #f1f5f9} .feature{flex:1;padding:12px;text-align:center} .feature h3{margin:0 0 8px;font-size:16px} .footer{padding:18px;text-align:center;font-size:13px;color:#6b7280} @media (max-width:480px){.features{flex-direction:column}} </style> </head> <body> <table class="email-wrapper" cellpadding="0" cellspacing="0" role="presentation"> <tr> <td> <table class="email-body" cellpadding="0" cellspacing="0" role="presentation"> <tr> <td class="header"> <div class="logo">Quantives</div> <div style="font-size:13px;margin-top:6px;opacity:0.9">Smart emails, better engagement</div> </td> </tr> <tr> <td class="hero"> <h1 class="h1">Hello, {name} 👋</h1> <p class="p">We built something to speed up your workflow — a gorgeous email template you can use for product updates, newsletters, or onboarding sequences. Fully responsive and tested on major clients.</p> <p><a href="#" class="cta">View in Browser</a></p> </td> </tr> <tr> <td style="padding:0 18px 18px"> <div class="features"> <div class="feature"> <h3>Beautiful</h3> <p style="margin:0;color:#6b7280">Clean, modern layout your customers will love.</p> </div> <div class="feature"> <h3>Compatible</h3> <p style="margin:0;color:#6b7280">Table-based layout works across Gmail, Outlook & mobile.</p> </div> <div class="feature"> <h3>Actionable</h3> <p style="margin:0;color:#6b7280">Clear CTA and trackable links for better conversions.</p> </div> </div> </td> </tr> <tr> <td class="footer"> <div style="margin-bottom:8px">Sent with ❤️ from Quantives</div> <div style="font-size:12px;color:#9ca3af">You received this email because you're awesome. If you don't want these, <a href="#" style="color:#7c3aed;text-decoration:none">unsubscribe</a>.</div> </td> </tr> </table> </td> </tr> </table> </body> </html>
Available variables:
{name}, {email}, {phone}
Tips:
This uses XHTML 1.0 Transitional DOCTYPE for maximum email client compatibility
Email Preview
Click "Render Preview" to see your email
Preview with John
Preview with Sarah
Preview with Mike
Back
Update Template