Fonts

Font support is available for email templates built with Elemental markup in Design Studio (Beta). Set a font_family on your email channel element and Courier handles the rest — including automatic font loading for Google Fonts.

This feature applies to Elemental content (version: "2022-01-01") on the email channel only. Classic Designer templates are unaffected.

Setting a Font

Add a font_family field to your type: "channel", channel: "email" element.

{
  "version": "2022-01-01",
  "elements": [
    {
      "type": "channel",
      "channel": "email",
      "font_family": "Roboto, Arial, sans-serif",
      "elements": [
        {
          "type": "meta",
          "title": "Welcome to Courier"
        },
        {
          "type": "text",
          "content": "Thanks for signing up, {{name}}!"
        }
      ]
    }
  ]
}

Pro Tip: Use the exact fontFamily string from the catalog for the most reliable results. Fuzzy matching is supported (e.g., 'Roboto', sans-serif resolves correctly), but the canonical value is safest.

How font loading works:

Web-safe fonts (e.g., Verdana, Geneva, sans-serif) — applied via CSS font-family only. No external loading required.
Google Fonts (e.g., Roboto, Arial, sans-serif) — the stylesheet is fetched automatically on Courier’s servers. You don’t need to include any <link> tags.
Default — if font_family is omitted, Helvetica, Arial, sans-serif is used.

Font Catalog

Courier supports 70 fonts across two source types. Query the full catalog via GraphQL to get the latest list and exact fontFamily values.

Querying the Catalog

Use the Courier client SDKs to query the font catalog from your application.

# POST /client/q — authenticate with X-COURIER-CLIENT-KEY header
query {
  fontCatalog {
    name
    fontFamily
    sourceType
    fontUrl
    previewUrl
  }
}

sourceType returns either system (web-safe) or google (Google Fonts). Use the fontFamily field value as-is for the font_family property in your Elemental content.

Web-Safe Fonts

Web-safe fonts are installed on most operating systems and render consistently across all email clients without any external loading. See Web Fonts vs Email-Safe Fonts for background on email client compatibility. The 10 web-safe fonts in the catalog and their fontFamily values are available by querying the catalog with sourceType: "system".

Google Fonts

Courier automatically loads these fonts for supported email clients. For unsupported clients, rendering falls back to the next font in the stack (see Email Client Support).

Sans-serif (28 fonts)

Name	`fontFamily` value
Archivo	`Archivo, Arial, sans-serif`
Atkinson Hyperlegible	`'Atkinson Hyperlegible', Arial, sans-serif`
Barlow	`Barlow, Arial, sans-serif`
Bricolage Grotesque	`'Bricolage Grotesque', Arial, sans-serif`
Cabin	`Cabin, Arial, sans-serif`
DM Sans	`'DM Sans', Arial, sans-serif`
Exo 2	`'Exo 2', Arial, sans-serif`
Figtree	`Figtree, Arial, sans-serif`
IBM Plex Sans	`'IBM Plex Sans', Arial, sans-serif`
Inter	`Inter, Arial, sans-serif`
Josefin Sans	`'Josefin Sans', Arial, sans-serif`
Karla	`Karla, Arial, sans-serif`
Lato	`Lato, Arial, sans-serif`
Lexend	`Lexend, Arial, sans-serif`
Manrope	`Manrope, Arial, sans-serif`
Montserrat	`Montserrat, Arial, sans-serif`
Nunito Sans	`'Nunito Sans', Arial, sans-serif`
Open Sans	`'Open Sans', Arial, sans-serif`
Oswald	`Oswald, Arial, sans-serif`
Overpass	`Overpass, Arial, sans-serif`
Poppins	`Poppins, Arial, sans-serif`
PT Sans	`'PT Sans', Arial, sans-serif`
Quicksand	`Quicksand, Arial, sans-serif`
Raleway	`Raleway, Arial, sans-serif`
Red Hat Display	`'Red Hat Display', Arial, sans-serif`
Roboto	`Roboto, Arial, sans-serif`
Roboto Condensed	`'Roboto Condensed', Arial, sans-serif`
Rubik	`Rubik, Arial, sans-serif`
Sora	`Sora, Arial, sans-serif`
Source Sans 3	`'Source Sans 3', Arial, sans-serif`
Space Grotesk	`'Space Grotesk', Arial, sans-serif`
Syne	`Syne, Arial, sans-serif`
Ubuntu	`Ubuntu, Arial, sans-serif`
Work Sans	`'Work Sans', Arial, sans-serif`

Serif (14 fonts)

Name	`fontFamily` value
Arvo	`Arvo, Georgia, serif`
Cormorant	`Cormorant, Georgia, serif`
Crimson Pro	`'Crimson Pro', Georgia, serif`
DM Serif Display	`'DM Serif Display', Georgia, serif`
Fraunces	`Fraunces, Georgia, serif`
Libre Baskerville	`'Libre Baskerville', Georgia, serif`
Literata	`Literata, Georgia, serif`
Lora	`Lora, Georgia, serif`
Merriweather	`Merriweather, Georgia, serif`
Playfair Display	`'Playfair Display', Georgia, serif`
Roboto Slab	`'Roboto Slab', Georgia, serif`
Vollkorn	`Vollkorn, Georgia, serif`
Zilla Slab	`'Zilla Slab', Georgia, serif`

Display (6 fonts)

Name	`fontFamily` value
Abril Fatface	`'Abril Fatface', Georgia, serif`
Bebas Neue	`'Bebas Neue', Arial, sans-serif`
Comfortaa	`Comfortaa, Arial, sans-serif`
Pacifico	`Pacifico, Arial, sans-serif`
Righteous	`Righteous, Arial, sans-serif`

Monospace (6 fonts)

Name	`fontFamily` value
Fira Mono	`'Fira Mono', 'Courier New', monospace`
IBM Plex Mono	`'IBM Plex Mono', 'Courier New', monospace`
Inconsolata	`Inconsolata, 'Courier New', monospace`
Roboto Mono	`'Roboto Mono', 'Courier New', monospace`
Space Mono	`'Space Mono', 'Courier New', monospace`

Handwriting (3 fonts)

Name	`fontFamily` value
Caveat	`Caveat, Arial, sans-serif`
Dancing Script	`'Dancing Script', Arial, sans-serif`
Sacramento	`Sacramento, Georgia, serif`

Email Client Support

Fonts are loaded server-side for supported clients. For unsupported clients, the email falls back gracefully to the next font in the CSS stack — no broken layout, no error.

Email Client	Font Support
Apple Mail (macOS)	Supported
Apple Mail (iOS)	Supported
HEY webmail	Supported
Thunderbird 60+	Supported
Gmail (web, Android, iOS)	Not supported — falls back to stack
Outlook for Windows	Not supported — falls back to stack
Yahoo Mail	Not supported — falls back to stack
AOL Mail	Not supported — falls back to stack

For example, with font_family: "Roboto, Arial, sans-serif", Gmail and Outlook render the email in Arial while Apple Mail renders it in Roboto.

Best Practice: Always include a web-safe fallback in your font stack (e.g., Arial, sans-serif) so the email looks great in all clients, not just those that support web fonts.

Elemental Overview

Learn how to build email content with Elemental markup

Channel Element

Full reference for the channel element and its fields

CSS Classnames

Apply custom CSS styles to Courier email template blocks

Email Safe Formatting

HTML and CSS best practices for cross-client email rendering

Platform

Developer Tools

Help

Setting a Font

Font Catalog

Querying the Catalog

Web-Safe Fonts

Google Fonts

Email Client Support

Elemental Overview

Channel Element

CSS Classnames

Email Safe Formatting

​Setting a Font

​Font Catalog

​Querying the Catalog

​Web-Safe Fonts

​Google Fonts

​Email Client Support

Elemental Overview

Channel Element

CSS Classnames

Email Safe Formatting

Setting a Font

Font Catalog

Querying the Catalog

Web-Safe Fonts

Google Fonts

Email Client Support