Email Templates
免费 HTML 邮件模板
浏览预构建的响应式 HTML 邮件模板。预览并复制时事通讯、欢迎邮件、促销和交易邮件的 HTML。
Newsletter
Clean newsletter template with header, content sections, and footer.
HTML 源码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Newsletter</title>
</head>
<body style="margin:0;padding:0;background-color:#f4f4f5;font-family:Arial,Helvetica,sans-serif;">
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="background-color:#f4f4f5;">
<tr>
<td align="center" style="padding:40px 20px;">
<table role="presentation" width="600" cellpadding="0" cellspacing="0" style="background-color:#ffffff;border-radius:8px;overflow:hidden;">
<!-- Header -->
<tr>
<td style="background-color:#16a34a;padding:30px 40px;text-align:center;">
<h1 style="margin:0;color:#ffffff;font-size:28px;font-weight:bold;">Your Newsletter</h1>
<p style="margin:8px 0 0;color:#bbf7d0;font-size:14px;">Monthly updates and insights</p>
</td>
</tr>
<!-- Main Content -->
<tr>
<td style="padding:40px;">
<h2 style="margin:0 0 16px;color:#18181b;font-size:22px;">Featured Article</h2>
<p style="margin:0 0 20px;color:#52525b;font-size:15px;line-height:1.6;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.</p>
<a href="#" style="display:inline-block;background-color:#16a34a;color:#ffffff;text-decoration:none;padding:12px 24px;border-radius:6px;font-size:14px;font-weight:bold;">Read More</a>
<hr style="margin:30px 0;border:none;border-top:1px solid #e4e4e7;">
<h2 style="margin:0 0 16px;color:#18181b;font-size:22px;">More Stories</h2>
<table role="presentation" width="100%" cellpadding="0" cellspacing="0">
<tr>
<td style="padding:12px 0;border-bottom:1px solid #f4f4f5;">
<h3 style="margin:0 0 4px;color:#18181b;font-size:16px;">Story Title One</h3>
<p style="margin:0;color:#71717a;font-size:13px;">Brief description of the first story goes here.</p>
</td>
</tr>
<tr>
<td style="padding:12px 0;border-bottom:1px solid #f4f4f5;">
<h3 style="margin:0 0 4px;color:#18181b;font-size:16px;">Story Title Two</h3>
<p style="margin:0;color:#71717a;font-size:13px;">Brief description of the second story goes here.</p>
</td>
</tr>
<tr>
<td style="padding:12px 0;">
<h3 style="margin:0 0 4px;color:#18181b;font-size:16px;">Story Title Three</h3>
<p style="margin:0;color:#71717a;font-size:13px;">Brief description of the third story goes here.</p>
</td>
</tr>
</table>
</td>
</tr>
<!-- Footer -->
<tr>
<td style="background-color:#f4f4f5;padding:24px 40px;text-align:center;">
<p style="margin:0;color:#71717a;font-size:12px;">You received this email because you subscribed to our newsletter.</p>
<p style="margin:8px 0 0;color:#71717a;font-size:12px;"><a href="#" style="color:#16a34a;">Unsubscribe</a> | <a href="#" style="color:#16a34a;">View in browser</a></p>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html> How It Works
How to Use HTML Email Templates
1
选择模板
从专为实际使用设计的时事通讯、欢迎邮件、促销或交易模板中选择。
2
预览和自定义
在 iframe 中预览渲染的模板，并查看 HTML 源码以了解结构。
3
导出 HTML
一键复制完整的 HTML 代码，直接粘贴到您的邮件平台中。
功能特性
Why Use HTML Email Templates
响应式设计
每个模板使用基于表格的布局，在所有屏幕尺寸和设备上正确渲染。
经 Gmail 和 Outlook 测试
模板遵循邮件客户端兼容性最佳实践，确保在任何地方一致渲染。
干净的代码
内联 CSS 和语义表格结构生成轻量、可维护的 HTML 邮件代码。
深色模式就绪
颜色选择和对比度在亮色和深色模式邮件客户端中都运行良好。
移动优先
以移动阅读者为设计重点，确保在小屏幕上无需水平滚动即可阅读。
隐私优先
所有模板在您的浏览器中加载和渲染，不会收集或发送数据到外部服务器。
使用场景
Who Uses HTML Email Templates
邮件设计师
作为自定义邮件设计的起点，节省数小时的基于表格的布局工作。
营销人员
使用现成的响应式模板快速启动时事通讯和促销活动。
开发人员
复制干净的 HTML 源代码作为应用程序中程序化邮件生成的基础。
代理商
使用预构建的、经过测试的基础更快地向客户提供专业邮件模板。
Need More Power?
Sign up for a free Tomba account to unlock bulk processing, API access, CRM integrations, and 75 free searches per month.
有疑问？
HTML Email Templates
如果您在这里找不到问题的答案，请访问我们的 帮助中心 .