Outlook relies on Microsoft Word to display HTML emails. However, compared to other email clients and web browsers, Outlook has limited support for modern web technologies and CSS styling. As a result, emails with complex, multi-column layouts or advanced styling may appear inconsistent when viewed in Outlook. The following rendering inconsistencies are frequently reported due to Outlook's popularity among Firstup's customer base.

If white lines are appearing on your campaigns in Outlook, please refer to White/Grey Lines in Outlook.

Limitations

Buttons cannot be rounded

Outlook lacks support for the border-radius CSS property, which makes it challenging to create rounded elements. To address this limitation, we have implemented a workaround specifically for rounded images. We utilize Cloudinary to pre-crop images with rounded corners before displaying them in Outlook.

However, it is not advisable to use images for buttons in Outlook. This is due to complications related to image downloading and accessibility concerns. Therefore, we recommend exploring alternative approaches for creating buttons within Outlook emails.

Rounded button in Studio preview

Rounded button rendering in Outlook

Animated GIFs do not appear as animated

In Outlook, animated GIFs will only show the initial still frame, making them appear as regular static images without animation. For possible workarounds, please refer to Animated GIFS Not Playing in Outlook.

Animated GIF in Studio preview



Animated GIF rendering in Outlook

Web fonts are not supported

Outlook has limitations when it comes to using web-hosted fonts, including fonts from services like Google Fonts or self-hosted options. Instead, Outlook relies on fonts installed on the user's computer, such as common system fonts like Arial and Times New Roman, as well as any custom fonts that have been downloaded. Many organizations install their own corporate fonts on users' devices.

In our platform, we offer a standard font list that includes commonly used web-safe fonts and hosted web fonts. Additionally, customers have the ability to upload their own custom font files for use in their campaigns. When uploading a custom font, we provide the option for customers to set a fallback web-safe font to be used when the custom font is not available.

We also offer a preview feature that allows users to see how their campaigns will look with the fallback font, especially useful if they have selected a hosted or custom font.

Custom fonts in Studio preview

Custom fonts rendering in Outlook