Email Signature Generator
Design professional HTML email signatures with live preview.
Recommended tools
Affiliate links — we may earn a commission if you sign up.
About the Email Signature Generator
The Email Signature Generator builds a professional, table-based HTML signature that renders reliably in Gmail, Outlook, Apple Mail, and other common clients. A single form collects the full name, job title, company, email, phone, website, optional address, optional photo URL, brand color, and up to three social profiles for LinkedIn, Twitter, and GitHub. Three templates cover distinct styles: Minimal renders a clean one-column layout with subtle middle-dot separators, Classic pairs a round photo with a brand-colored ring and a vertical accent bar beside a stacked contact block, and Modern shows a bold brand-colored name, a rounded-square photo, and a divider above the social row. The HTML is assembled from nested tables with inline styles, and every field is escaped so ampersands and angle brackets can never break the markup. A live preview mirrors the generated code in a card, the Copy HTML button sends the markup to the clipboard, and Download HTML saves a standalone document that reminds you to right-click the signature inside your email client and choose Copy. Because the output relies only on widely supported tables and inline CSS, it survives the strict sanitizers that corporate mail servers apply to incoming content.
Examples
Defaults: Name "Jordan Rivera" · Title "Product Designer" · Company "Fernandes Labs" · Email "jordan@fernandeslabs.com" · Phone "+1 (415) 555-0142" · Website "fernandeslabs.com" · Address "123 Market St, San Francisco, CA" · Brand color #0ea5e9 · LinkedIn/Twitter/GitHub filled · Template: Modern
<table cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;"><tr><td style="vertical-align:middle;"><table cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;"><tr><td style="font-family:Arial,Helvetica,sans-serif;font-size:18px;font-weight:800;color:#0ea5e9;padding:0 0 1px;letter-spacing:-0.01em;">Jordan Rivera</td></tr><tr><td style="font-family:Arial,Helvetica,sans-serif;font-size:12px;color:#64748b;font-weight:500;padding:0 0 8px;">Product Designer at <span style="color:#0f172a;font-weight:600;">Fernandes Labs</span></td></tr><tr><td style="font-family:Arial,Helvetica,sans-serif;font-size:11px;padding:0 0 6px;line-height:1.6;"><a href="mailto:jordan@fernandeslabs.com" style="color:#475569;text-decoration:none;font-weight:500;">jordan@fernandeslabs.com</a><br /><a href="tel:+14155550142" style="color:#475569;text-decoration:none;font-weight:500;">+1 (415) 555-0142</a><br /><a href="https://fernandeslabs.com" style="color:#0ea5e9;text-decoration:none;font-weight:600;">fernandeslabs.com</a></td></tr><tr><td style="font-family:Arial,Helvetica,sans-serif;font-size:11px;color:#94a3b8;padding:0 0 6px;line-height:1.5;">123 Market St, San Francisco, CA</td></tr><tr><td style="padding-top:6px;border-top:1px solid #e2e8f0;font-family:Arial,Helvetica,sans-serif;font-size:11px;padding-top:8px;"><a href="https://linkedin.com/in/jordanrivera" style="color:#0ea5e9;text-decoration:none;">LinkedIn</a> <span style="color:#cbd5e1;margin:0 4px;">·</span> <a href="https://twitter.com/jordanrivera" style="color:#0ea5e9;text-decoration:none;">Twitter</a> <span style="color:#cbd5e1;margin:0 4px;">·</span> <a href="https://github.com/jordanrivera" style="color:#0ea5e9;text-decoration:none;">GitHub</a></td></tr></table></td></tr></table>
Name "Ada Lovelace" · Email "ada@example.com" · All other fields blank · Template: Minimal
<table cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;"><tr><td style="font-family:Arial,Helvetica,sans-serif;font-size:14px;font-weight:bold;color:#0f172a;padding:0 0 2px;">Ada Lovelace</td></tr><tr><td style="font-family:Arial,Helvetica,sans-serif;font-size:12px;padding:0 0 4px;"><a href="mailto:ada@example.com" style="color:#0ea5e9;text-decoration:none;">ada@example.com</a></td></tr></table>
Name "O'Brien & Sons" · Email "hello@obriensons.com" · Phone "(415) 555-0100" · Website "obriensons.com" · Photo URL "https://cdn.example.com/logo.jpg" · Brand color #059669 · Template: Classic
<table cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;"><tr><td style="padding-right:14px;vertical-align:top;"><img src="https://cdn.example.com/logo.jpg" width="72" height="72" alt="O'Brien & Sons" style="border-radius:50%;width:72px;height:72px;display:block;border:2px solid #059669;" /></td><td style="border-left:3px solid #059669;padding-left:14px;vertical-align:top;"><table cellpadding="0" cellspacing="0" border="0" style="border-collapse:collapse;"><tr><td style="font-family:Arial,Helvetica,sans-serif;font-size:15px;font-weight:bold;color:#0f172a;padding:0 0 2px;">O'Brien & Sons</td></tr><tr><td style="font-family:Arial,Helvetica,sans-serif;font-size:11px;color:#475569;padding:0 0 4px;line-height:1.5;"><a href="mailto:hello@obriensons.com" style="color:#475569;text-decoration:none;">hello@obriensons.com</a><br /><a href="tel:(415)555-0100" style="color:#475569;text-decoration:none;">(415) 555-0100</a><br /><a href="https://obriensons.com" style="color:#475569;text-decoration:none;">obriensons.com</a></td></tr></table></td></tr></table>
How to use
- 1
Fill in the Full name, Job title, Company, Email, Phone, and Website fields in the details card; leave the optional Address and Photo URL blank if you do not want those rows in the output.
- 2
Pick a Brand color with the color picker or type a hex value into the adjacent field; it drives the accent text, links, photo border, and divider.
- 3
Enter your social handles under the Social links heading — LinkedIn, Twitter / X, and GitHub — using placeholder formats like linkedin.com/in/username.
- 4
Switch template tabs from Minimal to Classic or Modern; Classic and Modern use the Photo URL for a round or rounded-square image.
- 5
Click Copy HTML to grab the markup, or Download HTML to save a wrapper page, then paste the table into your email client's signature editor.
Common use cases
- Outlook desktop signatures — table plus inline-style markup is the only layout Outlook renders dependably, so corp users get the identical brand block as the web output.
- Gmail and Google Workspace rollout — the same HTML pastes into the signature editor for an entire team without anyone hand-editing styles.
- Client onboarding kits — agencies hand new customers a ready signature so every email from the account team carries the client's own logo block.
- Brand consistency audits — a shared URL, brand color, and social set turns scattered staff signatures into one controlled template.
- Freelancer personal brand — a compact Modern signature for proposals and invoices replaces a plain-text sign-off with a polished identity.
- Event and conference organizers — speaker signatures embed a company name, talk website, and socials so every registration email promotes the event.
Technical SEO best practices
- Keep the layout table-based with inline styles; CSS classes and floating divs are stripped by Outlook and Gmail's mail client before they render.
- Use a hosted HTTPS image URL for the photo and logo; absolute URLs survive forwarding, while relative or local paths break for recipients.
- Test the signature by emailing it to yourself across Gmail, Outlook, and Apple Mail before rolling it out to the whole team.
- Leave the brand color applied to links and accents only; contact text in muted slate stays readable on white and does not fight the photo.
- Keep the signature under roughly 300px tall so it does not hijack the first screen of a reply thread where recipients actually focus.
- Clear the Phone or Website field when you do not want a row; empty inputs are skipped entirely instead of producing an empty link.
Tips
- Set the photo URL to a lightweight hosted image such as a 200px JPEG so signatures load fast for recipients on dialup or mobile data.
- Regenerate the HTML any time the brand color or social handles change; the preview updates live but an old download stays stale on disk.
- Use the address field for a single office line rather than a paragraph; recipients skim, and short addresses survive narrow preview panes.
- Run a quick self-test message for each template before your first send so the wrong template variant never slips into a client-facing email.
Frequently asked questions
Explore more seo tools
Browse the full collection of seo tools on the hub, or jump back to all categories.