Images

Images support written content, strengthen brand identity and provide visual context. They help break up text-heavy layouts and can be used to highlight key information or create visual impact.

When to use

Use images in your emails when they:

• Add value or context to the content rather than being decorative.
• Support key messages, such as showcasing a service, product, or event.
• Strengthen brand identity with approved photography or visual assets.
• Improve the scannability of long content by breaking it into sections.

Design guidance

• Use high-quality, optimised images that won’t slow down load times.
• Keep file sizes as small as possible (under 200 KB is recommended).
• Test on mobile to ensure images resize appropriately and remain legible.
• Maintain consistent aspect ratios when displaying images side by side.

Accessibility

• Provide meaningful alternative text (alt text) that explains the image’s purpose.
• Avoid embedding text in images, as it cannot be read by assistive technologies.
• Ensure images meet minimum colour contrast and readability standards.
• Use decorative images sparingly and give them an empty alt attribute (alt="").
• Design images to support accessibility for all users, including people who use screen readers, screen magnifiers or other assistive technologies.

Variations

The Images component offers flexible layout options to support a range of content. From full-width banners to side-by-side layouts, these options ensure images adapt to both single-column and multi-column designs.