Font Handling & Client Compatibility
How PostBrix renders fonts in exported HTML: @import statements, MSO conditional overrides, and email client compatibility.
Key Takeaways
- PostBrix inserts web font links into <mj-head> using standard <mj-font> declarations.
- MSO conditional comments protect against Outlook desktop replacing custom fonts with Times New Roman.
- Always configure a primary system fallback font (Arial, Georgia, Helvetica).
Generated Font Markup#
When you specify a custom Google Font (such as Inter or Poppins), PostBrix automatically outputs the proper web font import tag in the HTML <head>:
The <!--[if !mso]><!--> wrapper ensures that Outlook ignores the web font request entirely, preserving clean system font rendering without latency.
Architecting Resilient Fallback Font Stacks#
Because web fonts will not render on Windows Outlook or Gmail Android app, ensure your fallback stacks are thoughtfully chosen:
- Clean Sans-Serif:
'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif - Modern Serif:
'Merriweather', Georgia, Cambria, 'Times New Roman', serif - Monospace Code:
'Fira Code', Menlo, Monaco, Consolas, 'Courier New', monospace
Frequently Asked Questions
Why does Gmail on mobile ignore my custom Google Font?
The Gmail mobile app for iOS and Android strips external <link> and @import font stylesheets to improve data loading speeds. It will display the specified system fallback (like Roboto or Arial).
Can I embed base64 encoded font files directly into email HTML?
No. Base64 font strings inflate email file size beyond Gmail’s 102 KB clipping threshold and are blocked by most client security filters.