Where to paste it
Copy the signature first, then follow the steps for your mail client.
Airmail
Airmail shows mail through the system's WebKit view on Mac, iPhone and iPad, so rendering closely matches Apple Mail — the Apple Mail preview tab is the honest model for it.
Use “Copy HTML” for this app: it takes the markup itself.
Airmail is one of the few clients with a real HTML signature box — give it the markup itself, not the formatted paste.
- In Airmail, open Preferences, then Accounts, and select your account.
- Open the Signatures tab and add a signature.
- Switch the signature to HTML and paste the markup from “Copy HTML”.
- Assign the signature to the account and close the preferences.
- Send yourself a test message.
Apple Mail (macOS)
Apple Mail renders with WebKit, the Safari engine — what works in a browser works here. Remote images load by default, and dark mode inverts only near-white backgrounds and near-black text, which is exactly what the Apple Mail preview tab shows.
Use “Copy signature” for this app: it pastes the formatted signature.
Apple Mail pastes rich content faithfully once one checkbox is off. The signature box may show no images until you compose a message; that is normal.
- Open Mail, then Settings (Preferences on older macOS), then Signatures.
- Select your account in the left column — not All Signatures — and click + to add a signature. Give it a name.
- Untick “Always match my default message font”, then paste with Cmd+V.
- Under Choose Signature at the bottom, pick it for that account.
- Compose a new message to yourself to see it in place, images included.
eM Client
eM Client has rendered with a Chromium core since version 7 and blocks external content by default until a sender is trusted. The Thunderbird preview tab — a standards engine with the same default block — is the closest model.
Use “Copy HTML” for this app: it takes the markup itself.
eM Client can take the signature as a file, which is the faithful route — “Download .htm” gives you that file.
- Open Menu, then Settings, then Mail, then Templates and Signatures.
- Choose Signatures, then add a new signature.
- Paste the markup in — or use “Download .htm” and import the file.
- Set it as the default for new messages and replies for your account.
- Send yourself a test message; external images wait for permission unless the sender is trusted.
Gmail (iOS)
The Gmail app runs messages through the same Google pipeline as Gmail on the web — inline styles only, proxied images, dark-mode darkening — so the Gmail preview tab models it. Its own mobile-signature box is plain text; the web signature is the one to set.
Use “Copy signature” for this app: it pastes the formatted signature.
The app's own mobile signature is plain text. Set the signature in Gmail on the web and leave the mobile one off; mail sent from the app then carries the web signature.
- Set the signature in Gmail on the web first — the Gmail (web) entry above has those steps.
- In the Gmail app, open Settings and choose the account.
- Open the signature setting and leave the mobile signature switched off.
- With it off, messages sent from the app use the signature you set on the web.
- Send yourself a test message from the app to confirm.
Gmail (web)
Gmail rewrites messages on Google's servers: style blocks are stripped so only inline styles survive, images are re-served through Google's proxy, and dark mode darkens light fills. This signature is inline-styles-only for exactly that reason.
Use “Copy signature” for this app: it pastes the formatted signature.
Gmail keeps inline styles and drops everything else, which is exactly what this signature is made of.
- In Gmail on the web, open Settings with the gear icon, then See all settings.
- On the General tab, scroll to Signature and choose Create new. Give it a name.
- Click into the editing box and paste with Ctrl+V (Cmd+V on a Mac).
- Under Signature defaults, pick it for new emails and for replies and forwards.
- Scroll to the bottom and choose Save Changes, then send yourself a test message.
kMail (Infomaniak)
kMail cleans incoming HTML against a safelist — Infomaniak's mobile clients are open source, which is how we know — drops some attributes, zooms an over-wide message to fit, and recolours algorithmically in dark mode. The kMail preview tab models exactly that.
Use “Copy HTML” for this app: it takes the markup itself.
kMail’s signature editor has an HTML source mode; paste the markup there. Pasting the formatted signature into the normal editor works too, but keeps less of the layout.
- Open Mail at ksuite.infomaniak.com/mail, then the Settings icon at the top right.
- Choose the email address in the left menu, then Signatures, then Add. Give it a name.
- Switch the editor to HTML source code and paste the markup, then save.
- In the signature settings, set it as the default for new messages and for replies and forwards.
- The Infomaniak Mail apps on iOS and Android use the same signature. Send yourself a test message.
Mail (iOS)
Mail on iOS renders with WebKit exactly like Apple Mail on the Mac — the Apple Mail preview tab models both — but its signature editor is plain text, so a rich signature only gets in through the copy-paste route and may be simplified on the way.
Use “Copy signature” for this app: it pastes the formatted signature.
The Signature box in iOS Settings is plain text — pasting there directly loses the layout. The route that works is copying from a message you sent yourself.
- Email yourself the signature: compose a message, paste it in after “Copy signature”, and send it.
- Open that message in Mail on the iPhone or iPad, touch and hold the signature, then Select All and Copy.
- Go to Settings, then Apps, then Mail, then Signature (on older iOS: Settings, Mail, Signature).
- Clear the box and paste. The formatting may look simplified in the box; that is the editor, not the signature.
- Send yourself a test message to confirm the images and links survived.
Mail (Windows 10)
While it worked, the Mail app drew messages with the same Word engine as Outlook classic — the Outlook (desktop) preview tab is why it is listed here. Today its entry is a pointer to the new Outlook.
Use “Copy signature” for this app: it pastes the formatted signature.
Microsoft retired the Mail app at the end of 2024 — it no longer sends or receives. Its replacement is the new Outlook, which is the entry to follow.
- The Windows Mail and Calendar apps were switched off by Microsoft at the end of 2024 and can no longer send or receive mail.
- Windows opens the new Outlook in their place, and accounts move over there.
- Follow the Outlook Modern (Windows / web) entry to set the signature in the new Outlook.
Mailbird
Mailbird embeds a Chromium view, so rendering itself is faithful; what shows in practice is its remote-image blocking. The Thunderbird preview tab — a standards engine with the same default block — is the model; Gecko's conditional-CSS stripping does not apply to Mailbird.
Use “Copy signature” for this app: it pastes the formatted signature.
Mailbird keeps remote images off by default — recipients see your signature; inside Mailbird itself, images may wait for a click.
- Open the menu, then Settings, then Identities.
- Select the identity and choose Edit.
- Paste the signature into the signature editor with Ctrl+V.
- Save, and repeat for your other identities if you use several.
- Send yourself a test message, and allow images for the sender to see them inline.
Outlook (iOS)
Outlook for iOS shows mail through WebKit fed by Microsoft's pipeline, dark-mode contrast repair included, so the Outlook.com (web) preview tab is the honest model. Its signature editor is far more limited than its message view.
Use “Copy signature” for this app: it pastes the formatted signature.
Outlook's mobile signature box is officially plain text; a rich paste only partly survives. Set the signature on the desktop or web too, and expect the phone editor to simplify.
- If you also use Outlook on the web or the new Outlook, set the signature there first — the Outlook Modern entry has those steps.
- In the Outlook app, tap your account picture, then the gear, then Signature.
- Clear the box and paste the signature you copied.
- The editor may simplify some of the layout: it is a plain-text field taking a rich paste.
- Send yourself a test message and check it on the phone and on a desktop.
Outlook Classic (Windows)
Outlook classic draws mail with Word's layout engine: no rounded corners, widths are not capped, and only the first font of a list is used. The Outlook (desktop) preview tab models this engine — the one that renders signatures most differently.
Use “Copy signature” for this app: it pastes the formatted signature.
Outlook classic draws messages with Word’s layout engine. The paste works; if the layout shifts, the .htm file route in step 4 is the faithful one.
- Go to File, then Options, then Mail, then Signatures. (From a new message: Message, Signature, Signatures.)
- Choose New, name the signature, and paste into the Edit signature box with Ctrl+V.
- Under Choose default signature, pick it for New messages and for Replies/forwards, then OK.
- If the result looks off: use “Download .htm” instead, open the file in a browser, select all, copy, and paste that into the same box.
- Send yourself a test message and read it in Outlook classic itself — it is the one client that renders this differently.
Outlook Modern (Windows / web)
Outlook.com, new Outlook for Windows and Outlook for Mac share one browser engine: corners round, widths hold, and dark mode repairs contrast rather than inverting. The Outlook.com (web) preview tab models all three.
Use “Copy signature” for this app: it pastes the formatted signature.
Outlook.com, new Outlook for Windows and Outlook for Mac share one editor, so the same steps serve all three.
- Open Settings with the gear icon, then Accounts, then Signatures. (Outlook for Mac: the Outlook menu, Settings, Signatures.)
- Choose New signature and give it a name.
- Click into the editing box and paste with Ctrl+V (Cmd+V on a Mac).
- Tick it for new messages and for replies and forwards, then Save.
- Send yourself a test message and open it on a phone as well as a desktop.
Proton Mail
Proton Mail sanitises messages — style blocks go, inline styles stay — and loads remote images through its own proxy, stripping trackers. That sanitise-and-proxy shape is Gmail's, so the Gmail preview tab is the model; unlike Gmail, Proton does not darken colours in dark mode.
Use “Copy signature” for this app: it pastes the formatted signature.
Proton cleans incoming HTML strictly; your own signature pastes in as rich text.
- Sign in at account.proton.me and open Settings, then All settings.
- Under Identity and addresses, find Display name and signature.
- Paste the signature into the signature box with Ctrl+V (Cmd+V on a Mac).
- Save; set it per address if you send from several.
- Send yourself a test message.
Spark
Spark renders with a full browser engine — WebKit on iPhone and iPad, Chromium on the desktop — and applies no dark-mode transform of its own. The Apple Mail preview tab is the closest model; the one place it overstates is dark mode.
Use “Copy HTML” for this app: it takes the markup itself.
Spark's signature editor accepts HTML directly and syncs the result across your devices.
- Open Spark's Settings (Preferences on the Mac), then Signatures.
- Create a signature and open its editor.
- Choose the HTML option and paste the markup from “Copy HTML”.
- Turn the signature on for your account; it syncs to your other devices.
- Send yourself a test message.
Thunderbird
Thunderbird renders with Gecko, the Firefox engine — standards-respecting — but blocks remote images by default until the reader allows them, which is what the Thunderbird preview tab shows.
Use “Copy HTML” for this app: it takes the markup itself.
Thunderbird takes the HTML itself, and it blocks remote images by default until a reader allows them — the Thunderbird preview tab shows exactly that.
- Open Account Settings — from the menu, or right-click the account in the folder list.
- Select the account. Under Signature text, tick Use HTML.
- Paste the markup into the signature box.
- Or: use “Download .htm”, tick “Attach the signature from a file instead”, and choose that file.
- Close the settings; new messages from that account carry the signature. Send yourself a test and allow remote content to see the images.
Yahoo Mail (web)
Yahoo Mail renders in the browser and keeps most of what this signature uses, widths and rounded corners included — the Outlook.com (web) preview tab is the closest model. The one place it overstates is dark mode, which Yahoo leaves alone.
Use “Copy signature” for this app: it pastes the formatted signature.
Yahoo's signature editor takes the formatted paste.
- In Yahoo Mail, open Settings with the gear icon, then More settings.
- Choose Writing email and switch the signature on for your address.
- Click into the signature box and paste with Ctrl+V (Cmd+V on a Mac).
- Changes save as you make them; close the settings.
- Send yourself a test message.
Why are my images missing?
Your photo, logo and banner are not inside the message. The signature carries their addresses, and each reader’s mail client decides whether to fetch them. These are the reasons it may not, and what to do so the signature still works when it does not.
- Outlook on Windows blocks remote images by default
Outlook classic shows a bar offering to download pictures, message by message, and many people never click it. Corporate Outlook is often set to never download them at all.
- Company mail servers strip or rewrite them
Exchange transport rules, mail gateways and security scanners can remove remote images, replace their addresses with a checked link, or block hosts they do not know. The sender sees the signature; the reader sees the gap.
- Gmail fetches them through its own proxy
Gmail copies the image through Google’s servers the first time a message is opened. The address has to be public and https; the first load can lag a moment, and a host that refuses Google’s fetcher shows nothing.
- Thunderbird and kMail block them until the reader allows it
Both treat remote content as a privacy decision: a bar asks whether to load it, per sender or per message. Until then every image is a labelled placeholder.
- Dark mode swallows a dark logo on a transparent background
No client inverts images. A dark mark saved on a transparent background disappears against the dark canvas — in Gmail, Outlook.com, Apple Mail, Thunderbird and kMail alike.
What to do
- Keep the signature legible without any image: name, role and contact details as text, never as a picture.
- Always set the alt text. The description is what a blocked image shows, and it is what the reader gets.
- Never put essential information — a phone number, a web address — only inside an image.
- Prefer https addresses on a reliable host you control, and keep them live for as long as the mails exist.
- Give a dark logo its own light background, or use a version light enough to survive a dark canvas.
The Thunderbird tab above the preview shows exactly this: every image blocked, every placeholder labelled, and whether the signature still says who you are.
What to feed each slot
- Photo
Rendered 40–200px wide, set by the Design panel's slider. A square JPG or PNG of 200–400px a side covers every size crisply on a retina screen; crop it square before switching rounding on, or the circle comes out an oval.
- Company logo
Rendered small — up to about 120×20px beside the company line, or up to 160px wide with the explicit width control. A transparent PNG with 120–200px of height in the source keeps the edges clean at any of those sizes.
- Banner
Rendered at the signature's own width — 480 to 720px, per the width control — with the height following the image. A JPG or PNG at twice that width, 1200–1440px, stays sharp on a modern screen; keep it clearly wider than tall, or it reads as a poster.
- Animated GIFs
Outlook on Windows shows only the first frame, as a still — it does not animate. Enough of your readers are on it that frame one has to carry the whole message on its own: if the point only lands on frame four, most people never see it. A GIF we host keeps every frame exactly as you sent it — only comments and embedded metadata are removed — and is never resized, so it must already have its slot's proportions: exactly four times as wide as tall for a banner, 1200×300 for example, and under 1 MB.
- Icons
The contact-line and social icons are ours, served from subsigno.com. Nothing to prepare, nothing to host.
Every slot takes a public https address — a link any reader's mail client can fetch, never a file on your machine. Keep each image under about 200 KB: it travels with every message you send. The finder under Business can pull candidates straight from your own website.
Why does my signature look different in every mail client?
Because a mail client is not a browser. Each one decides for itself what of your formatting to keep, and the differences below are the ones that actually change what your reader sees.
The font is not the one I chose
Mail clients cannot download fonts. Gmail removes the tags that would deliver one, and Outlook on Windows ignores the instruction outright — so a downloaded font would look right to you and fall back to Times New Roman for most of the people reading your mail.
That is why the font list here is short: every option is a font already installed on the machines your readers use. Outlook on Windows is stricter still — it takes the first font name it recognises and substitutes Times New Roman for anything it does not, rather than working down the list the way a browser does. Nothing on this site will offer you a font that behaves differently for you than for your reader.
My round photo arrives square
Outlook classic on Windows draws messages with Microsoft Word's layout engine, and Word has no concept of a rounded corner. The image arrives square for every one of those readers, and no markup changes that.
“Outlook” is really several different programs. Outlook.com in a browser, new Outlook for Windows and Outlook for Mac all render with a browser engine and round the image correctly; only Outlook classic on Windows does not. The preview has a tab for each, so you can see both outcomes rather than guessing.
Rounding also only produces a circle if the picture is square to begin with. A rectangular photo rounds to an oval, and the editor says so rather than cropping it — cropping needs an instruction the Word engine ignores while still obeying the size, which stretches the image instead.
My images do not show at all
Your logo and photo are not inside the message. The address is, and each reader's mail client fetches the picture from wherever you pointed it — so the address has to stay reachable, publicly and over https, for as long as those mails exist.
Thunderbird blocks remote images by default and offers a bar to load them, per sender. kMail lets each person choose. Gmail fetches them through its own proxy. So a signature whose meaning depends on a picture is a signature a good share of your readers never see — which is why every image here carries alt text and a reserved size, and why nothing about your name or contact details is drawn as a picture.
Dark mode changes my colours
Every client that has a dark mode rewrites message colours, and each does it differently. Gmail darkens light backgrounds and lifts dark text. Outlook.com repairs contrast rather than inverting: it keeps a colour that already reads and rewrites one that would not. Apple Mail only flips what it considers plain — near-black text on near-white — and leaves anything it reads as a brand colour alone. Thunderbird can adapt a message from a toggle. kMail darkens it on a near-black canvas.
None of them touch images. That is the trap worth knowing: a dark logo saved on a transparent background disappears against a dark canvas, in every one of them. A logo with its own light background, or one light enough to survive, avoids it. Use the dark toggle above the preview to check yours.
The width is not what I set
The width control is a cap, not a fixed size. The signature shrinks to fit a narrow phone rather than forcing a sideways scroll, which is what a fixed width would do.
Outlook classic on Windows ignores the cap and sizes the signature to its content instead. What it does honour is the width of the banner and the disclaimer, so those two — the blocks that would otherwise run the full width of a reading pane — are held to your number there too. kMail's apps go further and zoom a message down to fit the screen; a signature already narrow enough is left alone.
So what should I do about all this?
Send yourself a test message before you roll a signature out, and read it in the client your colleagues actually use. The preview here is a careful model of documented behaviour, not the client itself, and it says so.
Beyond that: keep it short, keep the meaning in the text rather than in a picture, and pick a font and a colour that survive being rewritten. A signature that reads plainly when every image is blocked and every colour is adjusted is a signature that works everywhere.
How do I add a button?
There is no button builder in the editor, and that is deliberate — but a button in an email is a simpler thing than it looks, and there are two honest ways to make one.
As an image (recommended)
- Design the button as a picture — a rectangle with your wording on it — about 1200 pixels wide so it stays sharp on a modern screen.
- Upload it somewhere public that serves https, and copy its address.
- Paste the address into Banner image URL under Extras, put where it should lead into Banner links to, and describe it in Banner description for anyone whose images are blocked.
- This is a real, clickable button in every mail client, because it is only an image with a link on it — the oldest trick in email, and the one nothing breaks.
As a coloured table cell
- The alternative is a one-cell table with a background colour, some padding and a link inside it. It stays crisp at any zoom, it costs no image, and it still shows when images are blocked.
- It has to be a padded table cell, not a padded link: Outlook ignores padding on a link and you get a bare line of text.
- This is exactly how the Banner CTA layout draws its button — pick that layout and fill in the button text and link, and you have one without writing anything.
- If you are pasting your own markup into a signature box, the shape below is the one to copy.
For the image route, Canva, Figma and Photopea all have free tiers that do this in a couple of minutes; GIMP does it offline. Any of them will export a PNG.
<table role="presentation" cellpadding="0" cellspacing="0" border="0">
<tr>
<td align="center" bgcolor="#2fbfa0" style="padding:12px 24px;border-radius:2px">
<a href="https://example.com/book"
style="font-family:Arial,Helvetica,sans-serif;font-size:14px;
font-weight:bold;color:#ffffff;text-decoration:none">Book a call</a>
</td>
</tr>
</table>