Skip to main content

Our email CSS engine is open source. Give it a star on GitHub 

Emailens

CSS property · data last changed 10 Nov 2026

background-image in email clients

Works in 16 of 21. Not supported in Outlook Classic. Partial in Yahoo Mail, Yahoo Mail Android, Yahoo Mail iOS and 1 more.

Your reader in Outlook Classic sees the email without background-image, even if it looks right where you tested it.

caniemail (MIT) via @emailens/engine 0.18.22

What to do instead in Outlook Classic

Always set background-color alongside background-image as a fallback for blocked or unloaded images. Use VML for Outlook hero backgrounds. Place critical text directly in HTML, not embedded in the background image, so it remains readable when images fail.

Use VML for background images in Outlook

instead
<td background="hero.jpg" bgcolor="#333333" width="600" height="300" valign="top"
    style="background-image: url('hero.jpg'); background-size: cover;">
  <!--[if gte mso 9]>
  <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true"
    stroke="false" style="width:600px; height:300px;">
    <v:fill type="frame" src="hero.jpg" color="#333333" />
    <v:textbox inset="0,0,0,0">
  <![endif]-->
  <div style="padding: 40px;">
    <h1 style="color: #fff;">Hello World</h1>
  </div>
  <!--[if gte mso 9]>
    </v:textbox>
  </v:rect>
  <![endif]-->
</td>
Show the original
before
<td style="background-image: url('hero.jpg');
            background-size: cover; padding: 40px;">
  <h1 style="color: #fff;">Hello World</h1>
</td>

The checker needs a computer screen.

A free account opens all 21 clients and keeps your checks for 7 days. Create a free account →

Every account includes one free real-device check in classic Outlook, Outlook for Mac and Apple Mail, after you verify your email and run one preview, while this month's free capacity lasts. How real-device checks work →

background-image is not among the 24 features we have screenshotted on real installs. The ones we have →

All 21 clients, problems first

ClientSupport
Outlook Classic Not supported See caveat 1
Yahoo Mail Partial See caveat 2
Yahoo Mail Android Partial See caveat 2
Yahoo Mail iOS Partial See caveat 2
AOL Mail Partial See caveat 2
Works in 16: Gmail, Gmail Android, Gmail iOS and 13 more. Show all
ClientSupport
Gmail Works
Gmail Android Works
Gmail iOS Works
Outlook 365 Works
Outlook (New) Works
Outlook iOS Works
Outlook Android Works
Outlook for Mac Works
Apple Mail Works
Apple Mail iOS Works
Samsung Mail Works
Thunderbird Works
HEY Mail Works
Proton Mail Works
Fastmail Works
Superhuman Works

Caveats (2)

  1. 1. Outlook Classic: Background images can be used in VML. See backgrounds.cm and VML documentation.
  2. 2. Yahoo Mail, Yahoo Mail Android, Yahoo Mail iOS, AOL Mail: Partial. Does not support multiple values. The comma between two values is removed.

Caveats as recorded by caniemail (MIT), one entry per wording.

How background-image behaves

background-image paints raster or gradient imagery behind an element. It is one of the most cross-client-fragile properties: Outlook Classic requires VML fallback for background images on <td> elements, and several clients block or proxy external image URLs by default.

  • Outlook Classic ignores CSS background-image on <td>; you must use VML <v:rect> with <v:fill type="frame" src="..."> for coverage.
  • Most clients require background-color to be set as a fallback when images are blocked, or the CTA disappears entirely.
  • background-size and background-position are inconsistently supported, design backgrounds that tile or center predictably.

Your next question

background-image in Outlook Classic · Every feature in Outlook Classic · All email CSS features · What real installs show

Get new email CSS fixes by email.

caniemail (MIT) via @emailens/engine 0.18.22 · tested upstream 24 Jul 2023 · data last changed 10 Nov 2026 · Outlook (New) cells are the engine's mapping