E-mailsjabloonbouwer

Bouw responsieve HTML-e-mailsjablonen met live voorbeeld, inline CSS en kopieer-naar-klembord. Tabelgebaseerde lay-out voor compatibiliteit met e-mailclients.

Sjabloon

Bedrijfsnaam

Logo-URL (optioneel)

Primaire kleur

Koptekst

Hoofdtekst

Knoptekst

Knop-URL

Voettekst

Live voorbeeld

HTML-uitvoer

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Welcome aboard!</title>
</head>
<body style="margin: 0; padding: 0; background-color: #f4f4f7; font-family: Arial, Helvetica, sans-serif;">
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="background-color: #f4f4f7;" role="presentation">
<tr><td align="center" style="padding: 20px 10px;">
<table border="0" cellpadding="0" cellspacing="0" width="600" style="max-width: 600px; background-color: #ffffff; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.05);" role="presentation">

        <tr><td align="center" style="padding: 30px 0 20px 0; font-family: Arial, Helvetica, sans-serif; font-size: 24px; font-weight: bold; color: #4f46e5;">My Company</td></tr>
        <tr><td style="padding: 0 40px;"><table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
          <tr><td style="padding: 20px 0 10px 0; font-family: Arial, Helvetica, sans-serif; font-size: 28px; font-weight: bold; color: #333333; text-align: center;">Welcome aboard!</td></tr>
          <tr><td style="padding: 10px 0; font-family: Arial, Helvetica, sans-serif; font-size: 16px; line-height: 24px; color: #555555; text-align: center;">Thank you for joining us. We are excited to have you on board.</td></tr>
          <tr><td align="center" style="padding: 25px 0;"><table border="0" cellpadding="0" cellspacing="0" role="presentation"><tr><td align="center" style="border-radius: 6px; background-color: #4f46e5;"><a href="https://example.com" target="_blank" style="display: inline-block; padding: 14px 30px; font-family: Arial, Helvetica, sans-serif; font-size: 16px; font-weight: bold; color: #ffffff; text-decoration: none; border-radius: 6px;">Get Started</a></td></tr></table></td></tr>
        </table></td></tr>
<tr><td style="padding: 20px 40px 30px 40px; background-color: #f9f9f9; border-top: 1px solid #eeeeee;">
<table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation">
<tr><td style="font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 20px; color: #999999; text-align: center;">My Company, 123 Main Street, City, Country</td></tr>
</table>
</td></tr>
</table>
</td></tr>
</table>
</body>
</html>

Ctrl+Enter uitvoerenCtrl+Shift+C kopiëren

Meer informatie

Email Template Builder: Design Cross-Client HTML Emails

Build HTML email templates that render correctly in Gmail, Outlook, and Apple Mail. Visual editor with table-based output.

Why Email Templates Matter for Every Business

Email remains the highest-ROI marketing channel, but poorly formatted emails get ignored or land in spam. A well-structured HTML email template ensures your message renders correctly across Gmail, Outlook, Apple Mail, and dozens of other clients, each with their own rendering quirks.

5 min lezenLees de volledige gids

Gerelateerde tools

Wist u dat?

Wachtwoordgenerator

Beveiliging

Genereer sterke, willekeurige wachtwoorden met aanpasbare lengte, tekensets en bulkgeneratie.

Wachtwoordgenerator

UUID-generator

Willekeurig getal generator