Previewing Outlook with Emailens

Looking for the full per-feature CSS support data rather than how the preview works? See the Full CSS support reference on emailens.dev.

Outlook has three variants with two different rendering engines.

Variants

Outlook 365 (Web) & Outlook (New)

Both use the same Outlook Web rendering engine. The new Outlook for Windows is Microsoft's Chromium-based replacement for classic Outlook, shipping as the default Windows mail client.

CSS support is good:

• Supports most box model properties
• Supports border-radius
• Partial background-image support
• Partial box-shadow support
• Limited flexbox support
• No display: grid
• position, transform, animation, and transition are stripped

Dark mode , applies partial color inversion; use [data-ogsc]/[data-ogsb] overrides to control rendering.

Outlook Classic (Word engine) , ⚠️ Deprecated

Outlook Classic (2007–2021) uses Microsoft Word to render HTML. This is the most restrictive major email client. Microsoft is replacing it with New Outlook by October 2026.

• No border-radius , Word doesn't support rounded corners
• No flexbox or grid , use tables exclusively
• No box-shadow , no shadow support at all
• No opacity , transparency is not supported
• No background-image on most elements , use VML for background images
• Limited max-width , partial support only
• No box-sizing , box-sizing: border-box is ignored
• Dark mode , Outlook Classic applies full color inversion; use [data-ogsc]/[data-ogsb] overrides to control rendering

Recommendations for Outlook Classic

1. Use table-based layouts exclusively
2. Use VML (Vector Markup Language) for rounded corners and background images
3. Set explicit widths in pixels (not percentages) for reliable sizing
4. Use mso- conditional comments for Outlook-specific styling:

<!--[if mso]>
<table><tr><td style="padding: 20px;">
<![endif]-->
  <div style="padding: 20px;">Content</div>
<!--[if mso]>
</td></tr></table>
<![endif]-->

As users migrate to New Outlook, the need for these workarounds will decrease.