Simple contact footer
Best when you need a professional sign-off with direct contact information and no heavy marketing block.
Email tool page
Email Signature Generator
Create a compact email signature block with contact details, CTA links, optional logo support, and copy-ready HTML.
This page expands the site from single-image signatures into structured email sign-offs that can be copied into Gmail, Outlook, or another mail client.
- Copy-ready inline HTML
- Compact layout tuned for email footers
- Desktop and mobile preview widths
- Optional logo and CTA support
Builder
Create the signature block first
This is the general-purpose builder for users who want a clean email footer before they choose a client-specific installation path.
Accent
Builder notes
- Keep the signature block shorter than the email body it supports.
- One CTA is usually enough for a business email footer.
- Preview the layout at narrow widths before copying the final HTML.
Live preview
Email signature preview
Check the layout at both a generous width and a tighter mobile-like width before installing it.
Desktop width
|
Narrow width
|
HTML output
Copy-ready signature markup
Use the buttons below when you need to paste the signature into a client or hand the HTML to someone else.
<!-- Signature Maker email signature -->
<table role="presentation" cellpadding="0" cellspacing="0" border="0" style="width: 100%; max-width: 560px; border-collapse: collapse; font-family: Arial, Helvetica, sans-serif; color: #172033;">
<tr>
<td style="padding: 0;">
<table role="presentation" cellpadding="0" cellspacing="0" border="0" style="width: 100%; border-collapse: collapse; border-top: 3px solid #a54f31; background: #ffffff;">
<tr>
<td style="padding: 18px 0 0;">
<table role="presentation" cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse;">
<tr>
<td style="vertical-align: top;">
<div style="font-size: 20px; line-height: 26px; font-weight: 700; color: #172033;">
Jordan Lee
</div>
<div style="padding-top: 5px; font-size: 13px; line-height: 19px; color: #536076;">Partnerships Lead · Northline Studio</div>
<table role="presentation" cellpadding="0" cellspacing="0" border="0" style="margin-top: 12px; border-collapse: collapse;">
<tr>
<td style="padding: 0 0 6px; font-size: 13px; line-height: 20px; color: #536076;">
<span style="display: inline-block; min-width: 54px; font-weight: 700; color: #a54f31;">Email</span>
<a href="mailto:jordan@northline.studio" style="color: #172033; text-decoration: none;">jordan@northline.studio</a>
</td>
</tr>
<tr>
<td style="padding: 0 0 6px; font-size: 13px; line-height: 20px; color: #536076;">
<span style="display: inline-block; min-width: 54px; font-weight: 700; color: #a54f31;">Phone</span>
<a href="tel:+14155550147" style="color: #172033; text-decoration: none;">+1 (415) 555-0147</a>
</td>
</tr>
<tr>
<td style="padding: 0 0 6px; font-size: 13px; line-height: 20px; color: #536076;">
<span style="display: inline-block; min-width: 54px; font-weight: 700; color: #a54f31;">Web</span>
<a href="https://northline.studio" style="color: #172033; text-decoration: none;">northline.studio</a>
</td>
</tr>
</table>
<table role="presentation" cellpadding="0" cellspacing="0" border="0" style="margin-top: 14px; border-collapse: collapse;">
<tr>
<td style="border-radius: 999px; background: #a54f31;">
<a href="https://northline.studio/book" style="display: inline-block; padding: 10px 14px; color: #fffaf5; font-size: 13px; font-weight: 700; text-decoration: none;">
Book a call
</a>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>How to use it
Keep the signature block useful, not oversized
- Add your name, role, company, contact details, and any CTA link that belongs in the footer.
- Keep the layout compact and preview it at both full width and narrower mobile width.
- Copy the generated HTML or download it as an HTML file before installing it in your mail client.
Best uses
Where this workflow fits best
CTA-ready signature
Add a booking or offer link without letting the footer become louder than the email body.
One layout for multiple clients
The generated HTML works as a stable base for Gmail, Outlook, and other clients that accept pasted signature markup.
Next step
Installation guides
How to Add a Signature to GmailGenerate a clean signature PNG, upload it to Gmail, and keep the sign-off compact and readable in outgoing email.How to Add a Signature to OutlookCreate a compact email signature, paste or install it in Outlook, and verify that the layout stays clean in new messages and replies.
Decision support
Compare the workflow before you commit
Signature Generator vs WiseStampCompare Signature Maker's lightweight signature asset and email-signature builder with WiseStamp's full email-signature platform for templates, installs, and company-wide management.Signature Generator vs MySignatureCompare Signature Maker's faster signature workflow with MySignature's template-driven email signature platform for branding, analytics, and team management.
FAQ
Answers for the exact email-signature task
Does this page generate real HTML or just a screenshot preview?
It generates copy-ready HTML with inline styles so you can paste markup into a supported signature flow instead of rebuilding the layout by hand.
Should I add every possible social link?
No. Keep the block selective. A smaller number of useful links is easier to scan and is less likely to overwhelm the recipient.
Can I pair this with the handwritten signature generator?
Yes. Use the signature image generator when you need a personal sign-off mark, then pair it with this text-based footer in the mail client or a hosted HTML flow.