Add custom fonts

Before you proceed with this tutorial, make sure you have the correct license for the font you are going to use and that it is intended for use on a commercial website. Purchase the Webfont version of the font.

Step 1: Upload font

1. From Shopify admin, go to Settings → Files
2. Click Upload files and select all your font files
3. Keep this page open since you’ll need the URLs in Step 2

Step 2: Load font into theme

1. From Shopify admin, go to Online Store → Themes
2. Click Customize
3. Open Theme settings and scroll to CUSTOM CODE
4. Use ThemeGoal @font-face generator to generate the needed code, and paste the generated code into  Css code area.
5. When you’re done click Save

You can use the @font-face generator multiple times to apply fonts for display text, header text, body text separately, paste all the generated code into the "Css Code" area, and make sure to enter different font names.