# Email Signature HTML: What Each Mail Client Accepts

> What each mail client does to your HTML signature: Gmail strips style blocks, classic Outlook drops flexbox, Apple Mail needs the HTML box ticked.

Source: https://toolpantry.app/blog/email-signature-html-clients

Every mail client takes the HTML you give it and removes something. Gmail deletes your style block. Classic Outlook drops your layout and shows the photo square. Apple Mail quietly shows plain text unless one box is ticked. None of this is a bug on your side — the clients are decades apart, and the fix is to write HTML that survives all of them.

## Quick answer

**The short answer:** use inline styles only, lay out with tables, and use web-safe fonts. Everything else is a detail per client: Gmail wants a hosted https image URL and no base64; Apple Mail needs **HTML** ticked in Mail → Preferences → Signatures; Thunderbird can load an external .html file; and classic Outlook for Windows — which renders mail with the Microsoft Word engine — needs a bgcolor attribute and an explicit line height, not a unitless one.

## The one rule that explains most of it

Mail clients are not browsers, and the oldest ones are not browsers at all. The pattern that holds across every client:

- **Style blocks are removed.** A <style> section in the head, and any CSS class, is stripped. Only style="..." written on the element itself survives.
- **Layout is done with tables.** Not because tables are elegant, but because they are the one layout method every client from Outlook 2003 to Apple Mail respects.
- **Web fonts are dropped.** A @font-face rule is ignored, so the design falls back to a system font — often Times New Roman, which is why "my signature looked fine on my machine" so often does not match.

Everything below is a variation on that. The [email signature generator](https://toolpantry.app/email-signature-generator) on this site already follows these three rules, so what you copy out of it is safe in every client — that is the point of the next table.

## Gmail: the client that hides your source

Gmail has no HTML source box for signatures. You cannot paste markup into it and have it treat it as markup. The working method is:

1. Open the signature HTML in a browser, where it renders the way you designed it.
2. Select the rendered signature and copy it.
3. Open **Gmail → Settings → Signature** and paste.

What Gmail does to the markup on the way in and out:

- **No base64 images.** A signature image has to be a publicly reachable https URL. An embedded data URI is stripped, and a file:// path works on your machine only.
- **Style blocks are removed**, and the size of a <style> tag is capped at 16 KB even in the clients that allow it at all.
- **Background images on cells are unreliable** — a solid background-color survives more often than a picture does.

One more Gmail detail that catches people out: an image inside a signature is not attached to the message, it is fetched from its public URL by the recipient's client. If the recipient blocks images, they see a blank box — so always write the name and contact details as real text, not as part of a picture.

## Apple Mail on a Mac: one checkbox

Apple Mail supports HTML signatures, and the setting that decides whether you get one is a checkbox. Open **Mail → Preferences → Signatures**, select the signature, tick **HTML**, and then paste. Without that box ticked, Apple Mail shows the raw tags or falls back to plain text, which looks like the tool failed when it did not.

Two things worth knowing once it is working:

- **Apple Mail has its own font list.** A font that exists on the web is not automatically available to it, so a signature that uses a web font falls back to something else — usually Times New Roman. Use a system font stack such as Helvetica, Arial, sans-serif.
- **The signature is stored on disk** as a .mailsignature file under ~/Library/Mail. That is why a signature can disappear after a macOS upgrade, and why an HTML file that you can edit by hand is a useful source to keep.

## Thunderbird: it can read a file

Thunderbird's signature settings live in **Account Settings → Signature text**, and there is a **Use HTML** checkbox plus a button to choose an HTML file from disk. That file option is the useful one: keep signature.html next to your other documents, point Thunderbird at it, and you can edit the source in a text editor and reload it without re-pasting anything.

Thunderbird is also the most forgiving of the four about CSS — caniemail's client tests list it as supporting the style constructs that Gmail and classic Outlook reject. That does not change the advice: if the signature has to work in Gmail as well, write to the lowest common denominator.

## Outlook: two different products with the same name

This is the part most guides get wrong, because "Outlook" is not one thing. caniemail's current client results:

| Client | Flexbox | What it uses to render mail |
|---|---|---|
| Outlook 365 | Works | Its own engine |
| Outlook (New) | Works | Its own engine |
| Outlook iOS / Android | Works | Its own engine |
| Outlook for Mac | Works | Its own engine |
| Outlook classic (Windows) | Dropped | **The Microsoft Word engine** |

So the widely repeated claim that "email clients do not support flexbox" is out of date. Modern Outlook handles it. But classic Outlook for Windows still renders mail with Microsoft Word, and that is where signatures break in a way people cannot explain: side-by-side blocks stack, a rounded photo shows square, a gradient disappears, and a web font becomes Times New Roman.

Classic Outlook has three specific habits to write around:

- **Cell backgrounds want a bgcolor attribute**, not only a CSS background. Set both and it works everywhere.
- **Unitless line heights are ignored.** line-height:1.6 means nothing to it; give a pixel value and add mso-line-height-rule:exactly so the two agree.
- **Images need their size stated twice** — a width attribute and a style width — or they render at their natural pixel size and blow out the signature.

## The whole thing on one page

| Client | Where the signature goes | The thing it needs |
|---|---|---|
| Gmail (web) | Settings → Signature | Copy the *rendered* signature from a browser; hosted images, no base64 |
| Apple Mail (macOS) | Mail → Preferences → Signatures | Tick **HTML** |
| Thunderbird | Account Settings → Signature text | Tick **Use HTML**, or point at an HTML file |
| Outlook 365 / New / iOS / Mac | Settings → Mail → Compose and reply | Nothing special; modern CSS works |
| Outlook classic (Windows) | File → Options → Mail → Signatures | Tables, bgcolor, pixel line heights, sized images |
| iPhone Mail | Settings → Mail → Accounts → Signature | Plain text only — the iOS mail app has no HTML signature field |

That last row matters for the many people who search for an "iPhone email signature generator": the iOS Mail app stores a plain text signature, so a generated HTML block cannot be pasted there. What you can do is keep the HTML as the master and put a short plain-text version in the iPhone field — name, phone, email, one link — and let the other clients use the rich one.

## Make it once, then install it four times

Build the signature in the [signature generator](https://toolpantry.app/email-signature-generator), then:

1. **Save the HTML file.** The generator can download it. That file is your source of truth — edit it and re-copy, rather than editing inside a mail client, because Gmail and Outlook will rewrite what you paste into them.
2. **For Gmail**, open the file in a browser, select the rendered signature, and paste it into Settings → Signature.
3. **For Apple Mail**, paste the same rendered signature and tick HTML.
4. **For Thunderbird**, point the signature file setting at the saved HTML file.
5. **For Outlook**, paste the rendered signature. If it is classic Outlook, check the result — a stacked layout or a square photo means the Word engine is doing the rendering, and only the table rules above fix it.

If the signature carries an image, host it somewhere with a public https address, then compress it before you use it: a signature image is fetched by every recipient, and a 2 MB logo makes every message slower to open. The [image compressor](https://toolpantry.app/image-compressor) runs in your browser, so the file never leaves your machine to be shrunk. A [QR code](https://toolpantry.app/qr-code-generator) pointing at a contact page or a portfolio is one more thing worth hosting, and it is the one element that earns its weight on a phone screen.

## Test it before you send it to a client

Send yourself a message and look at it in the client you care about, not the one you wrote it in. Three checks worth doing:

- **Send with images off.** In Gmail, open the message and disable images. If your name and contact details disappear, they were part of a picture, and half of your recipients will not see them.
- **Read the raw source.** In Apple Mail, **View → Message → RAW Source** shows the text-only fallback: what someone on a stripped-down client reads. If it is a wall of tags, the plain-text part of the signature is missing.
- **Look at it on a phone.** A signature with two columns will not fit a narrow screen. Keep it to about two lines of contact details, with the font size at or below the size of the email body.

There is a rule of thumb that saves most of this: the ideal signature is about two lines, a business signature about five, and anything above that is decoration. A signature that is too long is the one thing every recipient notices.

## Notes

Written by the Tool Pantry team on 21 October 2026. Client support was cross-checked against caniemail’s client test results, Google’s own signature documentation, and the current Thunderbird and Apple Mail settings. We have not sent test mail from five different clients, so treat the table as a strong starting point and test the one you care about — there is a section below on how to check.

## FAQ

**How do I add an HTML signature to Gmail?**

Gmail has no HTML source box. Open the signature HTML in a browser, copy the rendered result, and paste it into Gmail → Settings → Signature. Images have to be publicly hosted https URLs — base64 and local file paths are stripped.

**Why does my email signature show as plain text in Apple Mail?**

Apple Mail needs the HTML box ticked: Mail → Preferences → Signatures, select the signature, tick HTML. Without it, the HTML is shown as text or dropped.

**Does Thunderbird support HTML email signatures?**

Yes. In Account Settings → Signature text, tick Use HTML. Thunderbird can also read the signature from an HTML file on disk, which is the easiest way to keep one master copy.

**Why does my signature look different in Outlook?**

Classic Outlook for Windows renders mail with the Microsoft Word engine, which ignores flexbox, grid and floats, drops background images and border-radius, and ignores unitless line heights. Use tables for layout, set both bgcolor and background-color, give line heights in pixels, and size every image. Modern Outlook 365 and the new Outlook do not have this problem.

**Can I use an HTML signature on my iPhone?**

Not in the iOS Mail app — its signature field is plain text only. Keep the HTML as the master for your other clients and put a short text version (name, phone, email, one link) in the iPhone field.

**Should I use a web font in my email signature?**

No. @font-face rules are ignored and the signature falls back to a system font, often Times New Roman. Use a system stack such as Helvetica, Arial, sans-serif, with a second fallback, and what you design is what people see.