Will this signature work in Outlook and Gmail?

Yes, the tool generates a table-based layout with inline CSS styles specifically designed to render consistently in Gmail, Outlook, and Apple Mail.

How do the social media icons work?

The builder automatically detects platforms like LinkedIn, X, GitHub, and YouTube from your pasted links and embeds them as email-safe inline-SVG data URIs.

What does the Auto theme option do?

The Auto theme injects a media query block for dark mode preferences, allowing clients like Apple Mail to automatically adjust the signature colors.

Do I need to upload my logo or photo to this tool?

No, you must host your photo or logo publicly and paste the image URL into the builder so email clients can load it.

Is my personal data sent to a server?

No, the signature generation runs entirely locally in your web browser, ensuring your contact details remain private.

Elysia Tools

Navigation

Design

Email Signature HTML Builder

Generate a clean, copy-paste HTML email signature that renders correctly in Gmail, Outlook, and Apple Mail — with avatar/logo, social icons (auto-detected from your links), accent color, light/dark/auto theme, and a table-based email-safe layout using inline styles. Copy the raw HTML and paste straight into your mail client.

Details

What this tool helps you do

Build a professional email signature that actually works across clients:

Fill in your details — name, job title, company, email, phone, website, address, and a public photo/logo URL.
Pick a layout — side-by-side (photo left, with an accent divider) or stacked (text only).
Style it — accent color, web-safe font, and Light/Dark/Auto theme (Auto injects a prefers-color-scheme block Apple Mail honors).
Add socials — paste LinkedIn/X/GitHub/Instagram/Facebook/YouTube links; icons render as email-safe inline-SVG data URIs.
Copy the HTML — self-contained table-based signature with inlined styles, ready to paste into Gmail / Outlook / Apple Mail.

Everything runs locally.

Execution

Run this tool

Fill in the form, run the tool, and review the result in one place.

Prepared example runs

Click an example to fill the form automatically. File inputs still need an upload.

2 examples

Full side-by-side signature with socials

A complete business signature with photo, accent divider, contact rows, and auto-detected LinkedIn/GitHub/X icons.

<table class="esig"><tr><td><img width="72" height="72"></td><td><div>Jane Doe</div><div>Product Manager · Acme Inc.</div><a href="mailto:[email protected]">[email protected]</a>…</td></tr></table>

Minimal stacked (dark theme)

A text-only stacked signature in dark theme — great for engineers who want a clean, dark-mode native look.

<table class="esig" style="background:#111827"><tr><td><div>Alex Chen</div><div>Staff Engineer · Nullcorp</div>…</td></tr></table>

Inputs

Options are grouped so long tools stay easier to scan.

13 options

ContentPaste or type the main input values.9

Full nametextRequiredJob titletextOptionalCompanytextOptionalEmailtextOptionalPhonetextOptionalWebsite URLtextOptionalAddresstextOptionalPhoto / Logo URLtextOptionalSocial linkstextareaOptionalOne per line or comma-separated. Auto-detects LinkedIn, X, GitHub, Instagram, Facebook, YouTube.

SettingsAdjust formats, ranges, numbers, and modes.4

Accent colorcolorOptionalFont familyselectOptionalLayoutselectOptionalThemeselectOptional

Result

Ready for a run

Run the tool to preview files, text, structured data, or streamed output here.

Samples

Email Signature HTML Builder

What this tool helps you do

Run this tool

Prepared example runs

Inputs

Result

Examples that match this tool

Continue with connected tools and hubs

Prepared example runs

Inputs

Result

Learn when to use this tool, what it supports, and how real users apply it.

Key facts

Overview

When to use

How it works

Use cases

Examples

1. Corporate Side-by-Side Signature

2. Minimalist Developer Signature

FAQ

HTML Viewer Samples

HTML with Images Samples

MSG Viewer Samples

Text with Sensitive Data Samples

Image Palette to Design Tokens

HTML Tag Stripper (HTML标签清除)

QR Code Generator

Accessibility Heatmap Generator

HTML Extraction, Cleanup, and Markdown/PDF Export Tools

Barcode, QR Code, and Label Tools

Web Accessibility Audit and Accessible Color Tools

HTML Content Extraction, Cleanup, and Delivery Tools