Skip to content
Contact us
All posts

Adding Custom Fonts to HubSpot Emails: A Step-by-Step Guide

Picture of Team ES By  Team ES  ·  1 minute read

Using Custom Fonts in HubSpot Emails — The Smart Way ✨

When working in the Drag and Drop (DND) email editor in HubSpot, you’ll notice a range of content elements in the Content tab that you can easily drag and drop to build your email layout.

The Design tab lets you adjust global styles — such as buttons, dividers, and text — giving your template a polished and consistent look.

🖋️ Default Font Options in HubSpot

HubSpot only includes email-safe fonts in the DND editor’s font field. This is intentional — email-safe fonts are supported across major email clients, including Outlook, ensuring your email design stays consistent for every subscriber.

Adding Custom Fonts to Your Email

If you want to use a custom font (like Gotham or Lato), you’ll need to work with a custom-coded email template. For this part, we assume you have a basic understanding of HTML and CSS.

🔧 Steps to Add Custom Fonts

  1. Go to Design Manager.
  2. Click on “New File” → select HTML + HubL → choose Email Template.
  3. In the template, locate the <style> tag inside the <head> section.
  4. This is where you can import your custom font using @import or a link to a hosted font.
  5. Add a fallback font for email clients that don’t support web fonts (like Outlook).

Example:

<head>
<style type="text/css">
/* CSS for email clients */
</style>
<!--[if (gte mso 9)|(IE)]>
<style type="text/css">
  body, table, td, a, h1, p {
    font-family: Arial, sans-serif !important;
  }
</style>
<![endif]-->
</head>

🧠 Why Fallback Fonts Matter

Some email clients (especially Outlook) don’t support web fonts. By using conditional comments, you can make sure those clients fall back to a safe font like Arial or another sans-serif option.

Place this conditional style sheet after your main styles — the last declared style will take precedence.

✨ Recommended Email-Safe Fonts

To avoid rendering issues, we always recommend using email-safe fonts. These are reliable, widely supported, and already available in the HubSpot DND email font field:

  • Arial
  • Courier New
  • Georgia
  • Lucida Sans Unicode
  • Tahoma
  • Times New Roman
  • Trebuchet MS
  • Verdana

✅ Pro tip: Email-safe fonts help maintain consistent branding and improve readability across different email clients — without the hassle of rendering issues.