Email signature best practices

The rules that decide whether a signature renders correctly: table layout, sized images, real text, explicit colour, tappable links and one hosted logo.

Most advice about email signatures is about what to put in them. This is about whether the thing you built survives the trip to somebody else's inbox, which is the part that actually goes wrong.

1. Tables and inline styles, nothing else

Outlook on Windows renders through Microsoft Word. Word ignores flexbox, CSS grid, external stylesheets, <style> blocks and max-width. A signature has to be a table with the styles written directly on each element.

2. Put width and height on the image tag

Word sizes an image from the file's intrinsic pixels unless the tag carries both attributes. Size it in CSS only and a 1200-pixel logo arrives 1200 pixels wide. Write width="150" height="92" as attributes, and repeat them in the inline style.

3. Never make the signature an image

An image-only signature disappears when the recipient's mail server blocks images, which many corporate servers do by default. Nobody can click the email address, select the phone number, or find you by searching their mailbox. Use real text with one small logo.

4. Set every colour, and a background

Dark mode in Outlook and Apple Mail inverts anything left to the default. Setting each colour explicitly, and giving the outer table an explicit white background, keeps the signature readable in both modes instead of turning dark text on a dark card.

5. Check the accent colour is readable

A brand colour picked to look good in a logo is very often unreadable as 12-pixel text. The accessibility floor for normal text is a contrast ratio of 4.5 to 1 against the background. Bright cyans and light greens routinely score under 3. Keep the hue, darken it until it passes.

6. Make it tappable

Phone numbers as tel: links and email addresses as mailto: links. More than half of business email is now read on a phone.

7. One logo, hosted, never attached

An attached logo shows a paperclip on every message and on every reply in the thread, and some spam filters score attachments in a signature. Host one small file on an HTTPS address instead. Keep it under about 20 KB.

8. Keep it under 600 pixels wide

Wider than that and it forces horizontal scrolling on a phone and gets clipped in narrow reading panes.

9. If you use an animated logo, design for the first frame

An animated GIF plays in Gmail, Apple Mail and Outlook on the web. It does not play in Outlook on Windows, which renders through Microsoft Word and shows the first frame only. That is not a setting anyone can change, so the rule is simple: the first frame has to work as a complete logo on its own. A build-up animation that starts on an empty canvas leaves a large part of your recipients looking at nothing.

Two more limits worth respecting. Keep the file under about 1 MB, because it downloads on every message you send and on every reply in the thread. And keep the motion short and quiet: a signature sits at the bottom of a work email, and a looping animation next to it competes with the message.

GIF is the only animated format to use. Animated WebP and APNG are not reliably supported by mail clients, and video of any kind does not play in email at all.

What to leave out

Tracking pixels. They are visible in most clients now and read as spam.
Social icons as images, which fail exactly when images are blocked. Use text links.
Quotes and long legal blocks. They add height to every message you will ever send.
A second signature for replies. One correct signature is easier to keep accurate.

Need a signature to install? Build one free, no account needed.

More guides

Last updated 2026-08-31.