Typography is one of the simplest ways to keep your emails on brand. A consistent typeface builds recognition over time, improves readability, and draws attention to your content.
Stripo lets you work with three kinds of fonts and add your own, so your campaigns use the typeface you want instead of falling back to system defaults.
Font types in Stripo:
Stripo organizes fonts into three sections in Style Options, Fonts.
Email Safe. Fonts like Arial, Georgia, and Times New Roman that work in every email client with no external files needed.
Web Fonts. A ready-made list of non-standard fonts that Stripo provides. They load from an external URL when the email opens and may not render in every email client.
Custom Fonts. Fonts you add yourself via a CSS URL or a font name when the font you need is not in the Web Fonts list. Like web fonts, they may not render everywhere.
Note: Web and custom fonts do not render in every email client. Gmail, Outlook for Windows, Yahoo, and others ignore them and fall back to a system font. Always set a fallback font and test before sending. For the full compatibility breakdown, see how email-safe, web, and custom fonts work in email clients.
How to manage Email Safe and Web Fonts?
Important note, Project settings provide the flexibility to define unique requirements for individual projects, whereas Group settings offer the ability to apply consistent configurations to all projects within the group.
In the "Fonts" section, you can edit, enable, or disable the display and access the Stripo embedded fonts list, and also, in addition to Email Safe and Web Fonts, you can add custom fonts to the editor;
First of all, what about embedded fonts? You can disable any Email Safe and Web Fonts;
Besides, you can change the font family of Email Safe fonts. To change it, you should click on the "dots"→ "Edit";
After that, you will get a pop-up window where you can change the font family.
You can disable Email Safe and Web Fonts, but you cannot delete them.
How to add a custom font?
Please be advised that the option of adding custom fonts is available with BASIC, MEDIUM, PRO, or PRIME plans.
Go to the "Fonts" → "Custom" section in the "Style Options" tab and scroll to the "+" icon;
You can connect a font in two ways:
External URL. Paste a link to a CSS file with the font and choose how it loads:
<link>,@import, or@font-face. Use this for Google Fonts, Adobe Fonts, or your own CDN.
For the difference between the three methods, see how to choose between link, import, and font-face.
Local Font. Enter just the font name and font family. Use this when the font is already installed on the recipient's device. No URL or loading method is needed, and the font renders only on devices where it is installed.
The steps below show the most common case, adding a font from Google Fonts by External URL.
How to install a font from Google Fonts into my Stripo account?
In the Custom Fonts section, click the plus (+) icon;
Now, head over to the Google Fonts website and choose the desired font for your email campaign. For this example, let's select the elegant and versatile Montserrat font;
Once you've selected Montserrat or any other font, click on the "Get font" button, followed by "Get embed code". This will provide you with the necessary information to integrate the font into your Stripo account;
Within the font customization interface, choose the desired weight and style for the font. You have the option to apply a full axis or select a specific value for the weight and style;
From the Google Fonts embed code, copy the Font URL;
Ensure that you accurately capture these details, as they will be crucial for the integration process;
Paste the Font URL into Stripo and click Continue;
Stripo checks the URL and fills in the remaining fields automatically. Click Connect to add the font;
Important note:
The URL to your font should not exceed 300 symbols.
Upon successful integration, you will receive a confirmation message indicating that the custom font has been added to your Stripo account. You can now access and utilize the font within your email designs.
Please be kindly advised that Stripo accepts font URLs in CSS format only.
This URL must be delivered on the HTTPS protocol, with a valid SSL certificate. Also, Policy CORS must be enabled in the host to deliver the font files.
Another important note: we strongly recommend you give custom fonts their real names.
How to find your custom font in the text block of the email template?
Click on the text block where you want to apply a custom font and proceed to the editing panel on top of the screen;
Additionally, check how to directly change your font-weight value in the code to the current styles of needed text.
As a sample, let's do the word "History of slavery" extra bold:
In our example, we added font-weight:900; style to the "History of slavery" text.
Great job:)
Would you like to add your custom font, which is not present on Google Fonts?
Please be advised that if you have a license for a paid custom font and want to use it in emails, then you need to:
Create a CSS file in which you describe the styles for connecting this font to your server;
The example of the code in the CSS file should be as follows:
@font-face {
font-family: 'custom_font_name';
font-style: normal;
font-weight: 400;
src: url('absolute_path_to_font_file') format('woff2');
}
Where an absolute_path_to_font_file should look similar to this:
https://website.com/fonts/customFontName.woff2
Add the link to that CSS file in Stripo as an External URL, the same way you would add any custom font URL, and choose the connection method that fits your case:
<link>,@import, or@font-face;
After you add a custom font, please check a few additional things:
check CORS policy for your fonts in some cases, it requires manually setting of CORS Headers. You can find more about CORS policy here;
we do not limit the use of formats (woff, woff2, ttf, otf, etc.);
please be advised that not all fonts are supported by all the email clients. Some of them will be changed to a particular font by default. For example, Gmail cuts the custom font that you have in your email and changes it to one of 11 standard ones. The same thing with font weights, some email clients support only 400 and 700 Regular and Bold at the moment;
Thank you for taking the time to read our articles. We hope you will find this information helpful.
If you have any additional questions, please email us at support@stripo.email.
We would be glad to talk with you.