E-Mail-Signatur-Generator — HTML-Signaturen für Gmail & Outlook
Erstelle eine professionelle HTML-E-Mail-Signatur, die in Gmail, Outlook und Apple Mail richtig aussieht, und kopiere sie mit einem Klick.
HTML-Quelltext anzeigen (3.038 Zeichen)
<table role="presentation" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;font-family:Arial, Arial, Helvetica, sans-serif;font-size:13px;line-height:19px;color:#4b5563;"><tr><td valign="top" style="padding:0 16px 0 0;"><table role="presentation" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;"><tr><td width="64" height="64" align="center" valign="middle" style="width:64px;height:64px;background:#244b3f;color:#ffffff;font-family:Arial, Arial, Helvetica, sans-serif;font-size:24px;font-weight:bold;text-align:center;border-radius:32px;">AM</td></tr></table></td><td width="1" style="width:1px;background:#244b3f;font-size:1px;line-height:1px;"> </td><td valign="top" style="padding:0 0 0 16px;font-family:Arial, Arial, Helvetica, sans-serif;font-size:13px;line-height:19px;color:#4b5563;"><div style="font-family:Arial, Arial, Helvetica, sans-serif;font-size:16px;line-height:20px;font-weight:bold;color:#111827;">Alex Morgan</div><div style="font-family:Arial, Arial, Helvetica, sans-serif;font-size:13px;line-height:18px;color:#244b3f;padding-top:2px;">Leitung Marketing <span style="color:#d1d5db;">|</span> Northwind Studio</div><div style="padding-top:8px;"><span style="color:#244b3f;font-weight:bold;">P</span> <a href="tel:+14165550142" style="color:#4b5563;text-decoration:none;">+1 (416) 555-0142</a><br><span style="color:#244b3f;font-weight:bold;">E</span> <a href="mailto:alex@northwind.example" style="color:#4b5563;text-decoration:none;">alex@northwind.example</a><br><span style="color:#244b3f;font-weight:bold;">W</span> <a href="https://www.northwind.example" style="color:#4b5563;text-decoration:none;">www.northwind.example</a><br><span style="color:#4b5563;">120 King St W, Toronto, ON</span></div><table role="presentation" cellpadding="0" cellspacing="0" border="0" align="left" style="border-collapse:collapse;margin-top:8px;"><tr><td style="padding:0 4px 0 0;"><a href="https://linkedin.com/in/alexmorgan" title="LinkedIn" style="display:inline-block;background:#244b3f;color:#ffffff;font-family:Arial, Arial, Helvetica, sans-serif;font-size:11px;font-weight:bold;line-height:22px;width:24px;height:22px;text-align:center;text-decoration:none;border-radius:3px;">in</a></td><td style="padding:0 4px 0 0;"><a href="https://x.com/alexmorgan" title="X" style="display:inline-block;background:#244b3f;color:#ffffff;font-family:Arial, Arial, Helvetica, sans-serif;font-size:11px;font-weight:bold;line-height:22px;width:24px;height:22px;text-align:center;text-decoration:none;border-radius:3px;">X</a></td></tr></table><table role="presentation" cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;margin-top:10px;"><tr><td style="background:#244b3f;padding:6px 12px;border-radius:3px;"><a href="https://northwind.example/book" style="color:#ffffff;font-family:Arial, Arial, Helvetica, sans-serif;font-size:12px;font-weight:bold;text-decoration:none;">20-Minuten-Gespräch buchen</a></td></tr></table></td></tr></table>
So richtest du sie ein
- Klicke oben auf „Signatur kopieren“.
- Öffne in Gmail die Einstellungen (Zahnrad-Symbol) → Alle Einstellungen aufrufen → Allgemein.
- Scrolle zu „Signatur“, klicke auf „Neu erstellen“, gib ihr einen Namen und füge sie dann in das Feld ein (Ctrl/Cmd+V).
- Wähle sie unter „Standardeinstellungen für Signaturen“ für neue E-Mails und Antworten aus und klicke dann unten auf „Änderungen speichern“.
- Gmail begrenzt Signaturen auf 10.000 Zeichen und zeigt nur Bilder an, die von einer öffentlichen https://-URL geladen werden.
Signaturen für das ganze Team (CSV)
Lade eine CSV-Datei mit Kopfzeile hoch: name, title, email, phone, mobile, linkedin, x, github, photo (URL). Jede Zeile wird zu einer eigenen Signatur mit der oben gewählten Vorlage und den Farben. Unternehmen, Website, Adresse, Logo, Button und Hinweistext kommen aus dem Formular, sofern die CSV keine eigene Spalte dafür hat. Bis zu 500 Personen.
Deine Angaben bleiben in deinem Browser: Die Signatur wird auf dieser Seite erstellt, nichts wird hochgeladen oder gespeichert. Bilder werden von den URLs geladen, die du eingibst. Alle kostenlosen Tools ansehen.
Ein Problem gefunden oder etwas, das besser sein könnte? Wir lesen jede Nachricht und beheben Fehler schnell.
Dieser E-Mail-Signatur-Generator erstellt aus deinem Namen, deiner Position, deinen Kontaktdaten, Foto oder Logo, Social-Media-Links und Markenfarbe eine Signatur, zeigt sie live in sechs Vorlagen und liefert dir HTML, das die E-Mail-Programme übersteht, die Leute tatsächlich nutzen. Klicke auf „Signatur kopieren“, füge sie in das Signaturfeld von Gmail oder Outlook ein, und das Layout bleibt erhalten.
E-Mail-Programme sind keine Webbrowser. Das klassische Outlook für Windows rendert HTML mit Microsoft Word, Gmail entfernt Style-Blöcke und CSS-Klassen, und die meisten Programme blockieren Bilder, die nicht unter einer öffentlichen https://-Adresse liegen. Deshalb nutzt die Ausgabe hier ausschließlich verschachtelte Tabellen und Inline-Styles, websichere Schriften und explizite Bildgrößen. Was das Tool nicht kann, ist deine Bilder zu hosten: Ein Foto oder Logo muss bereits online sein, und die Seite erklärt dir den Grund, wenn du eine lokale Datei versuchst. Für ein ganzes Team lädst du eine CSV mit Namen, Positionen und Telefonnummern hoch und bekommst pro Person eine HTML-Signatur, alle in derselben Vorlage und Markenfarbe.
So funktioniert’s
- Fülle deine Angaben aus. Leere Felder werden komplett aus der Signatur weggelassen.
- Füge die https://-URL eines gehosteten Fotos oder Logos ein oder lass beides leer, um eine Initialen-Kachel zu verwenden.
- Wähle eine Vorlage und eine Markenfarbe und füge bei Bedarf Social-Media-Links, einen Button oder einen Hinweistext hinzu.
- Klicke auf „Signatur kopieren“ und füge sie in die Signatureinstellungen deines E-Mail-Programms ein. Die Einrichtungsschritte für jedes Programm stehen unter der Vorschau.
- Schick dir selbst eine Test-E-Mail und prüfe sie auf dem Smartphone und am Desktop.
Häufige Fragen
Wie füge ich in Gmail eine HTML-Signatur hinzu?
Klicke auf dieser Seite auf „Signatur kopieren“, öffne dann in Gmail Einstellungen > Alle Einstellungen aufrufen > Allgemein, scrolle zu „Signatur“, klicke auf „Neu erstellen“ und füge sie in das Feld ein. Wähle sie unter „Standardeinstellungen für Signaturen“ aus und klicke unten auf der Seite auf „Änderungen speichern“. Füge nicht den HTML-Quelltext ein: Der Editor von Gmail akzeptiert nur die gerenderte Signatur, und genau die legt die Kopieren-Schaltfläche in deine Zwischenablage.
Warum werden die Bilder in meiner Signatur nicht angezeigt?
Meist, weil das Bild nicht unter einer öffentlichen https://-URL liegt. Gmail entfernt base64-Bilder (data:) aus Signaturen, Outlook blockiert viele externe Bilder, bis der Empfänger sie zulässt, und Bilder unter http:// oder hinter einem Login scheitern überall. Hoste das Bild auf deiner Website oder einem CDN, verwende den https://-Link und halte es klein (unter etwa 100 KB).
Warum sieht meine Signatur in Outlook anders aus?
Das klassische Outlook für Windows rendert E-Mails mit Word, das viele CSS-Eigenschaften ignoriert, darunter abgerundete Ecken – ein rundes Foto erscheint also eckig, und Abstände können sich leicht verschieben. Dieser Generator vermeidet Layout-CSS, das Word verwirft, und setzt auf Tabellen; deshalb bleibt die Struktur stabil. Das neue Outlook und Outlook im Web rendern näher an einem Browser.
Wie groß sollte ein Foto oder Logo in der E-Mail-Signatur sein?
Zeige es mit etwa 80–120 px Breite an und lade ein doppelt so großes Bild hoch (zum Beispiel 176×176 px für ein 88-px-Foto), damit es auf hochauflösenden Bildschirmen scharf bleibt. Halte die Datei unter 100 KB. Nimm PNG für Logos mit flächigen Farben und JPG für Fotos.
Wie lang darf eine E-Mail-Signatur sein?
Gmail begrenzt Signaturen auf 10.000 Zeichen HTML, und dieser Generator bleibt deutlich darunter. In der Praxis solltest du bei vier oder fünf Zeilen bleiben: Name, Rolle und Firma, ein oder zwei Kontaktwege und höchstens ein Call-to-Action. Lange Signaturen werden in Antworten abgeschnitten und schieben deine Nachricht auf dem Smartphone aus dem sichtbaren Bereich.
Was in E-Mail-Signaturen wirklich funktioniert
• Tabellen fürs Layout, keine divs mit Flexbox oder Grid. Outlook für Windows ignoriert modernes CSS-Layout.
• Inline-Styles an jedem Element. Gmail entfernt <style>-Blöcke und Klassennamen aus Signaturen.
• Websichere Schriften (Arial, Helvetica, Verdana, Georgia). Ein eigener Webfont fällt in Outlook auf Times New Roman zurück.
• Gehostete Bilder mit width- und height-Attributen. Ohne explizite Größen kann Outlook ein Logo in voller Originalgröße anzeigen.
• Text für Telefonnummern, E-Mail-Adressen und Links, keine Bilder davon. So bleiben sie anklickbar, auch bei deaktivierten Bildern lesbar und für Screenreader zugänglich.
Social-Media-Icons sind eine häufige Falle: Jedes Icon ist ein weiteres Bild, das gehostet werden muss und in vielen Postfächern standardmäßig blockiert wird. Die Vorlagen hier nutzen stattdessen kleine farbige Text-Badges, die überall dargestellt werden.
Die richtige Vorlage wählen
Klassisch und Modern passen für die meisten geschäftlichen Zwecke: ein Foto oder Logo neben deinen Angaben. Kompakt ist für Leute gedacht, die viel antworten und nicht unter jeder Nachricht einen großen Block wollen. Zentriert eignet sich für kreative Rollen, in denen die Signatur Teil der Marke ist. Banner gibt der Markenfarbe mehr Gewicht. Nur Text hat überhaupt keine Bilder oder farbigen Blöcke und ist damit die sicherste Wahl für Klartext-Programme, Mailinglisten und Support-Desks.
Was immer du wählst: Nutze im ganzen Team dieselbe Vorlage. Einheitliche Signaturen wirken durchdacht; ein Stil-Mix wirkt, als würde sich niemand um die Marke kümmern.
Rechtliche Hinweise und Tracking-Links
Manche Rechtsordnungen verlangen Firmenangaben in geschäftlichen E-Mails. Im Vereinigten Königreich muss eine Limited ihren eingetragenen Namen, ihre Registernummer und die Adresse ihres eingetragenen Sitzes angeben; in Deutschland decken die Impressumsregeln ähnliche Angaben ab. Ein Vertraulichkeitshinweis hat für sich allein wenig rechtliche Wirkung, halte ihn also kurz, falls du einen verwendest.
Wenn du einen Call-to-Action-Button oder einen Link zu einer Landingpage hinzufügst, versieh ihn mit UTM-Parametern (unser UTM-Builder erstellt den Link), damit die Klicks in deiner Webanalyse als "email signature" erscheinen und nicht als direkter Traffic.
Ähnliche kostenlose Tools
- Spam-Wörter-Checker — Füge Betreff und Text einer E-Mail ein, um Spam-Auslöser, Großbuchstaben-Geschrei, Probleme mit Links und Bildern sowie einen fehlenden Abmeldelink zu finden.
- Betreffzeilen-Tester — Bewerte eine Betreffzeile nach Länge, Spam-Triggerwörtern, Großbuchstaben und Satzzeichen und sieh in der Vorschau, wie sie auf dem iPhone und in Gmail abgeschnitten wird.
- QR-Code-Generator — Erstelle einen QR-Code für URL, Text, E-Mail, Telefon, SMS, WLAN oder Kontaktkarte in deinen Farben und lade ihn als PNG oder SVG herunter. Codes laufen nie ab.
- UTM-Link-Builder — Erstelle saubere, einheitliche UTM-Tracking-Links, damit du genau weißt, welche Kampagnen dir Kunden bringen.