Want to refresh your Shopify store a bit? Custom fonts can be way to make your brand look unique and professional. In just 10 minutes, you can completely transform your store’s appearance and build stronger brand recognition.
How to Add Custom Fonts to Shopify
Method 1: Upload Your Own Font Files
Step 1: Get Your Font Files
- Download the desired fonts in .woff2, .woff, .ttf, or .otf format
- Make sure you have commercial license for the font
Step 2: Upload to Shopify
- Go to Contents > Files (important: use Settings > Files, not Assets folder)
- Click “Upload files” and select your font files
- Copy the file URL after upload
Step 3: Add CSS Code
- Go to Online Store > Themes > Edit Code
- Open theme.liquid or base.css file
- Add this code:
@font-face {
font-family: 'YourFontName';
src: url('YOUR_FONT_URL_HERE') format('woff2'),
url('YOUR_FONT_URL_HERE') format('woff');
font-display: swap;
}
body {
font-family: 'YourFontName', sans-serif;
}Method 2: Use Google Fonts
Step 1: Choose Your Font
- Visit Google Fonts
- Select a font and copy the link code
Step 2: Add to Shopify
- Go to Online Store > Themes > Edit Code
- Open theme.liquid file
- Paste the Google Font link inside the
<head>section - Use the font in your CSS
Method 3: Use Font Apps
Fontify App
- Install Fontify: Google & Custom Fonts from Shopify App Store
- Free for Google Fonts, $3/month for custom fonts
- No coding required – just point and click
- Works with all Shopify themes
How to Use Fontify:
- Install the app
- Click “Enable” in the dashboard
- Choose your theme
- Select fonts from Google library or upload custom fonts
- Assign fonts to different elements (headings, body text, etc.)
- Save changes
FAQs
Q: What font formats work on Shopify? A: .woff2 (best), .woff, .ttf, and .otf formats all work. Use .woff2 for fastest loading.
Q: Can I add fonts without coding? A: Yes, use the Fontify app. It’s free for Google Fonts and only $3/month for custom fonts.
Q: Why isn’t my custom font showing up? A: Make sure you uploaded to Settings > Files (not Assets folder) and check your CSS code for typos.
Q: How many fonts should I use? A: Stick to 2-3 fonts maximum. Too many fonts slow down your site and look messy.
Q: Will custom fonts slow down my store? A: Not if you use .woff2 format and add font-display: swap to your CSS. Avoid using too many font weights.
Q: Are Google Fonts free for commercial use? A: Yes, all Google Fonts are free for commercial use on Shopify stores.
Q: Can I use the same font for everything? A: You can, but it’s better to use one font for headings and another for body text to create visual hierarchy.
Conclusion
Adding custom fonts to Shopify is simple and makes a huge difference in how customers see your brand. Use the Fontify app if you want the easiest solution, or upload fonts manually if you prefer more control. Remember to keep it simple with 2-3 fonts max, and always test how your fonts look on mobile devices. Your store will look more professional and memorable with the right typography choices.
