SVG in Email: Support, Workarounds, and Best Practices
Most email clients block SVG — but there are safe ways to use vector-quality graphics in email. Here's what you need to know.
The Problem: Email Client SVG Support
Unlike web browsers, email clients have inconsistent and generally poor SVG support. Many strip SVG entirely for security reasons (SVG can contain JavaScript). The safest approach is to export SVG to PNG and use that in emails.
| Email Client | SVG Support |
|---|---|
| Apple Mail | Yes — renders SVG |
| Outlook (Windows) | No — SVG not rendered |
| Gmail (web) | No — SVG stripped |
| Gmail (iOS/Android) | No — SVG stripped |
| iOS Mail | Yes — renders SVG |
| Thunderbird | Yes — renders SVG |
Best Practice: Export SVG to High-Res PNG for Email
For maximum email compatibility, export your SVG as a PNG at 2× resolution (for Retina screens). A logo at 200px wide should be exported at 400px wide. This ensures sharp rendering on all devices without browser-level SVG support.
Using SVG in Litmus-Compatible Emails
If your target audience primarily uses Apple Mail or Thunderbird, SVG is viable. Include a PNG fallback for clients that don't support SVG.
- Use the <picture> element (limited email support): <source type='image/svg+xml'> with <img> PNG fallback
- Test in Litmus or Email on Acid before sending to a list
- Keep SVG files small — complex SVGs may slow email rendering
- Avoid inline scripts in SVG — email clients that do render SVG often strip script elements
AMP for Email and SVG
AMP for Email (used by Gmail's AMP component system) does not support SVG inline. Use PNG or JPEG for AMP email visuals. AMP's interactive components use HTML/CSS, not SVG.
When SVG Works in Email
SVG works reliably in transactional emails sent to Apple Mail users, and in corporate email environments using Thunderbird or Apple Mail-based clients. For mass marketing emails, stick with PNG. Test your specific audience's email client distribution before deciding.
Frequently Asked Questions
Can I use SVG logos in email signatures?
Only if you're sure recipients use Apple Mail or Thunderbird. For mixed audiences, export the logo as a high-res PNG for reliable display in all clients.
Why does Gmail strip SVG from emails?
Gmail strips SVG as a security measure — SVG files can contain embedded JavaScript, which could be used for phishing or cross-site scripting attacks.
Is there a way to force SVG display in Outlook?
No reliable method exists. Outlook uses its own rendering engine that does not support SVG. Use PNG instead.
Can CSS-animated SVGs work in email?
Only in the few clients that render SVG (Apple Mail, Thunderbird). For animated email graphics, use GIF as the universal fallback.
What resolution PNG should I use to replace SVG in email?
Export at 2× your display size. For a 200px-wide header image, export at 400px wide with max-width: 200px in email CSS.
Related guides
Ready to Convert Your Image to SVG?
Free online converter — no sign-up, no watermarks, results in under 3 seconds.
Convert Image to SVG — Free