Outlook Signature Template Guide: Create, Install & Fix (2026)
Outlook is responsible for more broken email signatures than any other client — not because it’s bad, but because it renders HTML differently from every browser and most other email clients. This guide walks you through creating Outlook-compatible signature templates, installing them in every version of Outlook, and fixing the most common problems.
By the NeatStamp Team · Updated March 2026 · 16 min read
Why Outlook renders differently from everything else
This is the fundamental thing to understand before you build any Outlook signature. Outlook 2007 and later uses Microsoft Word’s rendering engine to display HTML email. Not a browser. Word.
That means Outlook’s HTML/CSS support is frozen roughly at 2003-era browser capabilities. Here’s specifically what that means:
Not supported in Outlook
- CSS flexbox and grid
- background-image on table cells
- CSS border-radius (ignored)
- External stylesheets and <style> blocks (partially ignored)
- max-width (use width attribute instead)
- CSS float on table cells
- SVG images
- CSS variables (custom properties)
Reliably supported
- HTML tables (the backbone of everything)
- Inline CSS styles
- font-family (with web-safe fallbacks)
- font-size, font-weight, color
- PNG and JPG images with width/height attributes
- Hyperlinks (<a href>)
- Table cell borders
- bgcolor attribute on table cells
The practical implication: any Outlook-compatible signature template must use HTML tables for layout and inline CSS for styling. Every other approach is a gamble.
Outlook on the web (Office 365 / OWA) is different — it uses a browser rendering engine and supports more modern CSS. But if your recipients use Outlook desktop, that’s what matters. For the full breakdown of design rules, the email signature design guide covers this in detail.
How to set up a signature in Outlook desktop (Windows)
This applies to Outlook 2016, 2019, 2021, and the Microsoft 365 desktop app on Windows. The interface is almost identical across all these versions.
Method 1: Using the Signatures dialog
- 1
Open Signature settings
In Outlook, click File → Options → Mail → Signatures. Alternatively, when composing a new email, click Insert in the toolbar, then Signature → Signatures.
- 2
Create a new signature
Click New. Give your signature a name — something descriptive like "Full Signature" or "Reply Signature." Click OK.
- 3
Add your signature content
The signature editor box appears at the bottom of the Signatures dialog. For a plain text signature, type directly here. For a formatted HTML signature, see Method 2 below.
- 4
Assign to email account
In the "Choose default signature" section at the top right, select which email account uses this signature. Choose a default for "New messages" and optionally for "Replies/forwards."
- 5
Save
Click OK twice. Open a new email to verify your signature appears.
Method 2: Installing an HTML signature (the reliable way)
The Outlook signature editor doesn’t have a “paste HTML source” button. The best way to install a formatted HTML signature is:
- 1
Get your rendered signature
In NeatStamp's editor, build your signature and click the copy button. This copies the rendered HTML version — the visual output, not the raw code.
- 2
Compose a new email
Open a new email composition window in Outlook.
- 3
Paste into the email body
Paste (Ctrl+V) your signature into the body of the new email. You should see it rendered with your formatting, logo, and colors.
- 4
Select all and copy
Select everything in the email body (Ctrl+A) and copy it (Ctrl+C).
- 5
Open Signatures and paste
Go to File → Options → Mail → Signatures. Click in the signature editor box and paste (Ctrl+V). The formatting should transfer intact.
- 6
Save and test
Click OK, compose a new email, and verify the signature looks correct. Send a test to yourself and a Gmail address to check cross-client rendering.
Method 3: Editing the .htm file directly
Outlook stores signatures as .htm files on disk. You can edit these directly with a text editor for precise HTML control:
C:\Users\[YourName]\AppData\Roaming\Microsoft\Signatures\Find the .htm file matching your signature name, open it in a text editor, and replace the body content with your HTML. Save the file, then restart Outlook. This method gives you the most control but requires knowing Outlook-compatible HTML.
Important: Outlook desktop ≠ Outlook on the web
Signatures set in Outlook desktop do NOT sync to Outlook on the web (OWA / Microsoft 365). You need to set up the signature separately in each environment. Both the Outlook guide and Outlook 365 guide explain the differences in more detail.
How to set up a signature in Outlook on the web
Outlook on the web (OWA) includes both outlook.com for personal accounts and the Microsoft 365 web interface for business accounts. They use the same interface but have slightly different navigation.
- 1
Open Settings
Click the gear icon in the top right corner of Outlook on the web.
- 2
Go to mail settings
Click 'View all Outlook settings' at the bottom of the settings panel. Then go to Mail → Compose and reply.
- 3
Find Email signature
Scroll down to the 'Email signature' section. You'll see a rich text editor.
- 4
Add your signature
Paste your signature into the editor. OWA's editor handles HTML better than Outlook desktop's signature dialog — it accepts more CSS properties. You can paste the rendered version directly.
- 5
Configure when it appears
Check 'Automatically include my signature on new messages' and optionally 'Automatically include my signature on messages I forward or reply to.'
- 6
Save
Click Save. The signature takes effect immediately for new emails.
OWA vs. Outlook desktop rendering
OWA renders email in a browser, so it supports more CSS than Outlook desktop. However, your recipients may be using Outlook desktop — so design for the most restrictive environment (Outlook desktop) regardless of where you set up your signature.
Outlook for Mac
Outlook for Mac uses a different rendering engine from Outlook on Windows — it’s closer to WebKit (Safari’s engine), so it supports more modern CSS. But your recipients on Windows Outlook still have the same limitations. Design for Windows Outlook, and Mac users will see it fine (or better).
- 1
Open Preferences
In Outlook for Mac, go to Outlook → Preferences (or Outlook → Settings on newer versions).
- 2
Open Signatures
Click on Signatures in the Email section.
- 3
Click the + button
This creates a new signature. Give it a name.
- 4
Edit the signature
The signature editor opens. For HTML signatures, the best method is to paste your rendered signature from NeatStamp directly into the editor.
- 5
Assign to account
At the top of the Signatures dialog, select which account uses this signature. Set it as default for new emails and/or replies.
Outlook mobile (iOS and Android)
Outlook mobile has its own signature setting, separate from desktop and web. It supports limited HTML formatting but not complex layouts.
- 1
Open Outlook on your phone
Tap your profile picture or initials in the top left corner.
- 2
Open Settings
Tap the Settings gear icon at the bottom left.
- 3
Find your email account
Under 'Mail', tap on your email account name.
- 4
Tap Signature
You'll see a toggle 'Use signature' and an edit field below it.
- 5
Edit your signature
Outlook mobile supports basic formatting: bold, italic, underline, and links. Paste a simplified version of your signature here. Complex table layouts won't render reliably on mobile.
Most professionals set their full HTML signature on desktop, and use a minimal 2–3 line text signature on mobile. This is the practical solution given mobile app limitations. The mobile-friendly signature guide covers how to design your desktop signature so it also renders well when your recipients read it on their phones.
HTML template rules for Outlook signatures
If you’re writing or customizing HTML for an Outlook signature, these are the rules that prevent the most common rendering failures.
Use tables, not divs, for layout
A two-column layout (logo on left, text on right) must use a table with two cells. A div with display:flex breaks completely in Outlook. The table approach is verbose but reliable.
<table cellspacing="0" cellpadding="0" border="0"><tr><td width="80" valign="top"><img src="logo.png" width="60" height="60" /></td><td valign="top" style="padding-left:16px;">Your name here</td></tr></table>All styles must be inline
Outlook partially respects <style> blocks in the <head> but strips them in many scenarios. The only safe approach is inline styles on every element.
<p style="font-family: Arial, sans-serif; font-size: 14px; color: #333333; margin: 0;">Set image dimensions in HTML attributes, not CSS
Outlook ignores CSS width and height on images. Set width and height as HTML attributes directly on the img tag. Use both, always.
<img src="logo.png" width="150" height="50" style="width:150px;height:50px;" alt="Company Logo">Add table reset attributes
Outlook adds default spacing between table cells. Remove it with: cellspacing='0' cellpadding='0' border='0'. Missing these can add unwanted gaps.
<table cellspacing="0" cellpadding="0" border="0">Use mso-line-height-rule for exact line heights
Outlook interprets line-height differently. Use mso-line-height-rule: exactly to prevent it from adding extra space.
style="line-height: 20px; mso-line-height-rule: exactly;"Use bgcolor for background colors, not CSS background-color
For table cells that need a background color, use the bgcolor HTML attribute alongside CSS for maximum compatibility.
<td bgcolor="#f8f9fa" style="background-color: #f8f9fa;">No SVGs — use PNG or JPG for all images
Outlook does not render SVG images. Convert all SVG icons and logos to PNG. Use @2x (2x actual size, displayed at half size) for retina sharpness.
The HTML email signature guide has a complete annotated template you can use as a starting point. For design-level decisions (fonts, colors, sizing), the best practices guide covers everything.
Common Outlook signature problems — and how to fix them
These are the problems I see most often with Outlook signatures. Each one has a specific fix.
Logo appears too large or at full resolution
Cause: Missing width/height HTML attributes on the img tag.
Fix: Add width='150' height='50' (or your logo's dimensions) directly to the img tag, alongside the same values in the inline style attribute. Both are needed.
Extra space above or below the signature
Cause: Outlook adds paragraph spacing above and below tables by default.
Fix: Add margin:0; padding:0; to your outer table and all surrounding elements. Also set mso-table-lspace:0pt; mso-table-rspace:0pt; on your tables.
Text appears in Times New Roman (not your chosen font)
Cause: Your font-family declaration uses only a custom font with no fallback.
Fix: Always declare font-family: 'YourFont', Arial, sans-serif. When Outlook can't load 'YourFont', it needs a web-safe fallback to use instead.
Images blocked / red X instead of logo
Cause: Outlook blocks externally hosted images until the user clicks 'Always download images.' This is the default for security reasons.
Fix: Always include descriptive alt text on images. Consider making your signature readable even without images — key info should be in text, not embedded in an image. Nothing you do will disable Outlook's image blocking; the user controls that setting.
Colors inverted in dark mode
Cause: Outlook in dark mode tries to invert elements that don't have explicit background-color declarations.
Fix: Add background-color: #ffffff explicitly to your outer table and key cells. Use a slightly off-white (#fafafa or #f8f9fa) for backgrounds — pure white (#ffffff) sometimes handles dark mode better than transparent. For a deep explanation, see the dark mode guide.
Signature disappeared or reverted
Cause: Outlook can reset signatures when profiles are rebuilt, when you reinstall Office, or after certain updates.
Fix: Save your signature HTML externally (a text file or in NeatStamp). That way, reinstalling the signature takes under 2 minutes. For teams, using a centrally managed signature tool prevents this entirely.
Two-column layout collapses to one column
Cause: Using CSS flexbox or float instead of HTML tables for the two-column layout.
Fix: Replace your flex or float layout with an HTML table. Two cells, valign='top'. This is the only reliable approach in Outlook desktop.
Signature shows as attachment
Cause: Usually caused by base64-encoded images embedded directly in the HTML.
Fix: Host your images at an external URL. Don't embed them as base64 strings. NeatStamp Pro hosts signature images on a CDN automatically; on the free plan, use a publicly accessible URL for your logo.
For specific problems like your signature not showing up at all, the Outlook signature not showing guide and the signature keeps disappearing guide have dedicated troubleshooting steps.
The easiest way: use an Outlook-compatible generator
If manually debugging Outlook-specific HTML isn’t how you want to spend your afternoon, the NeatStamp editor generates signatures that are pre-tested for Outlook compatibility. Everything it produces uses table-based layout, inline styles, HTML image attributes, and the other conventions described in this guide.
Here’s what the workflow looks like:
- 1.Open the NeatStamp editor and fill in your name, title, company, phone, and email.
- 2.Upload your logo (or skip it for a text-only signature).
- 3.Choose a template from the template library — all are Outlook-compatible.
- 4.Copy the signature using the copy button.
- 5.Paste it into Outlook using Method 2 (paste into email body first, then transfer to signature settings).
The whole process takes about 5 minutes. The signatures work in Outlook desktop (all versions from 2007 onwards), Outlook on the web, Outlook for Mac, Gmail, and Apple Mail.
For team deployments — where you need all employees to have the same signature — the business email signature guide and the Outlook-compatible signature guide cover the options for centralized management.
Frequently asked questions
Why does my email signature look different in Outlook?
Outlook uses Microsoft Word's rendering engine, not a browser. It doesn't support CSS flexbox, grid, or many other modern CSS properties. It also ignores CSS background-image on table cells. Use HTML tables with inline styles for reliable Outlook rendering.
How do I add an HTML signature to Outlook?
In Outlook desktop: go to File → Options → Mail → Signatures. Create a new signature, then paste your HTML. The most reliable method is to paste your signature into a new email first, then copy-paste from there into the signature dialog box.
Does Outlook desktop sync signatures with Outlook on the web?
No. Outlook desktop and Outlook on the web (OWA/365) store signatures separately. You need to set up your signature in each environment independently.
Why are my images not showing in Outlook?
Outlook blocks externally hosted images by default until the recipient clicks 'Download images.' Make sure your image has explicit width/height HTML attributes, is hosted at a public URL (not base64-embedded), and the alt text describes what the image is.
Can I have multiple signatures in Outlook?
Yes. You can create multiple signatures in Outlook and assign different ones to different email accounts. You can also set one signature for new emails and a different (shorter) one for replies and forwards.
How do I fix extra spacing in my Outlook signature?
Extra spacing in Outlook is usually caused by paragraph spacing or line-height on table rows. Set mso-line-height-rule: exactly and a fixed line-height on your table cells. Also add cellspacing='0' cellpadding='0' border='0' to your tables.
Related guides
Need an Outlook-ready signature?
NeatStamp generates Outlook-compatible HTML automatically — table-based layout, inline styles, the works. Free, no account needed.