Fonts

You can add a selection of premium fonts to your theme by using Shopify's font library.

Shopify's font library is a collection of fonts that includes system fonts, a selection of Google fonts, and licensed fonts from Monotype. These fonts are free to use on Shopify online stores, and are provided in both WOFF and WOFF2 formats.

The files for each font include the following Unicode ranges, provided that they are available for that font:

The initial selection of fonts covers a broad range of use cases. Due to licensing restrictions, however, there are some fonts that we aren't able to include. If you need to use a broader range of characters, then you can use system fonts, Typekit, or other solutions.

Personal access to the font files isn't currently available.

To add fonts from the library to your theme, you need to do the following steps:

  • Declare a font_picker setting type to allow merchants to select fonts by using the theme editor.
  • Use the setting value (which is provided as a font object) to set the CSS properties, such as font-family, font-weight, and font-style, in the theme’s stylesheet.
  • Use one of the font filters to load the chosen font or to obtain variants of that font:
    • Use the font_face filter to insert the default @font-face declaration.
    • Use the font_url filter to obtain a CDN URL and create a custom @font-face declaration.
    • Use the font_modify filter to obtain other font objects from the same family. You can do this for stylistic use, or to render content authored in a rich text editor that might include bold, italic, or bold-italic text.

You can view the complete list of available fonts in Shopify's font library.

Want to discuss this page?

Visit the Shopify Community