Zum Inhalt springen

HTML-E-Mail-Vorlagen

Kostenlose, produktionsfertige HTML-E-Mail-Vorlagen für gängige Geschäftsfälle. Kopieren Sie den Code und passen Sie ihn für Ihre Kampagnen an.

Newsletter

Clean newsletter template with header, content sections, and footer.

HTML-Quellcode

<!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. 01

    Vorlage auswählen

    Durchsuchen Sie die verfügbaren HTML-E-Mail-Vorlagen für verschiedene Geschäftszwecke.

  2. 02

    Vorschau ansehen

    Klicken Sie auf Vorschau, um die fertig gerenderte E-Mail in einer Vorschau zu sehen.

  3. 03

    HTML kopieren

    Kopieren Sie den vollständigen HTML-Code und passen Sie ihn für Ihre E-Mail-Kampagnen an.

// funktionen

Why Use HTML Email Templates

  • Produktionsfertige Vorlagen

    Vollständig kodierte HTML-E-Mail-Vorlagen, die sofort einsatzbereit sind.

  • Mehrere Kategorien

    Vorlagen für Newsletter, Transaktions-E-Mails, Promotionen, Willkommens-E-Mails und mehr.

  • E-Mail-Client-kompatibel

    Verwendet tabellenbasierte Layouts und Inline-Stile für Kompatibilität mit allen gängigen E-Mail-Clients.

  • Mobilfreundlich

    Responsive Designs, die auf Desktop- und Mobilgeräten gut aussehen.

  • Sofort kopierbar

    Vollständigen HTML-Code mit einem Klick in die Zwischenablage kopieren.

  • Kostenlos nutzbar

    Alle Vorlagen sind kostenlos und ohne Einschränkungen für persönliche und kommerzielle Projekte nutzbar.

// anwendungsfälle

Who Uses HTML Email Templates

  • E-Mail-Vermarkter

    Professionelle Kampagnen-E-Mails schnell mit vorgefertigten Vorlagen erstellen.

  • Entwickler

    Produktionsfertige E-Mail-Vorlagen für Transaktions- und System-E-Mails verwenden.

  • Startups

    Hochwertige E-Mail-Designs sofort nutzen, ohne ein Design-Team zu benötigen.

  • Agenturen

    Kunden-E-Mail-Kampagnen mit anpassbaren HTML-Vorlagen schnell umsetzen.

// faq

Häufig gestellte Fragen

Noch Fragen? Zum Hilfezentrum

// schnellstart

Ihr erster Aufruf in einer Minute

Kostenloses Konto, echter API-Schlüssel, dieselben Endpunkte, die Enterprise-Kunden nutzen.

  1. 1Kostenloses Konto erstellen25 Suchen pro Monat. Keine Kreditkarte.
  2. 2Schlüssel und Secret kopierenUnter API-Schlüssel im Dashboard.
  3. 3Die API aufrufenFügen Sie die Anfrage ein; die Antwort ist JSON.
curl "https://api.tomba.io/v1/email-finder?domain=piedpiper.com&first_name=Richard&last_name=Hendricks" \
  -H "X-Tomba-Key: $TOMBA_API_KEY" \
  -H "X-Tomba-Secret: $TOMBA_SECRET_KEY"
Antwort
200 OK· 1 search credit
{
  "data": {
    "email": "richard@piedpiper.com",
    "first_name": "Richard",
    "last_name": "Hendricks",
    "full_name": "Richard Hendricks",
    "website_url": "piedpiper.com",
    "company": "Pied Piper",
    "pattern": "{first}",
    "department": "executive",
    "type": "personal",
    "position": "CEO",
    "country": "US",
    "gender": "male",
    "twitter": null,
    "linkedin": "https://www.linkedin.com/in/richard-hendricks",
    "score": 100,
    "accept_all": false,
    "phone_number": true,
    "verification": {
      "date": "2025-01-15T10:32:00+01:00",
      "status": "valid"
    },
    "sources": [
      {
        "uri": "https://piedpiper.com/blog/engineering",
        "website_url": "piedpiper.com",
        "extracted_on": "2024-06-01T09:14:07+01:00",
        "last_seen_on": "2025-01-10T17:02:44+01:00",
        "still_on_page": true
      }
    ],
    "phone_data": []
  }
}