Custom web fonts don't work in every email client. If an email app doesn't support the font you uploaded, it shows a fallback font instead.
Why this happens
You can define custom fonts to use in Visual Builder, but the final font rendering still depends on the recipient's email client.
Some major email clients, including Gmail, Outlook, and Yahoo Mail, don't support most web fonts.
When a web font isn't supported, the email client uses the next font in the font stack based on CSS. This fallback is usually a similar web-safe font, so the content remains readable and the layout stays consistent.
What is the difference between a web-safe font and a web font?
Web-safe fonts
Web-safe fonts are commonly installed on most devices and widely supported across applications, including email clients.
Common examples include Arial, Courier, Georgia, Lucida Sans, Tahoma, Times New Roman, Trebuchet MS, and Verdana.
Web fonts
Web fonts are any fonts loaded from a remote source, such as Google Fonts, rather than being preinstalled on a device.
They offer more design flexibility, but email app support is inconsistent.
How to set up fonts
If you are setting up a custom font in Bloomreach, create a separate CSS file for each font weight. Point the src value to the font file URL in Asset Manager, upload the CSS file to Asset Manager, and then configure the font in Project settings > Campaigns > Fonts.
If you use Google Fonts, use the CSS file it generates. Manually creating a new CSS file can cause issues.
If the Google Fonts CSS includes multiple weights for the same font name, rename each variant before uploading. The Visual Builder can't interpret multiple font variants with the same name.