How to use custom fonts with your website

The beehiiv Website Builder includes a curated library of Google fonts to help you design a polished, on-brand site. For even more control, you can upload and use custom fonts — including your own font files or fonts from Adobe — to fully match your brand identity.

This guide walks through:

• How to upload custom font files.
• How to import Adobe fonts.
• How to apply custom fonts across your website.
• Common questions about using custom fonts.

From your beehiiv account, you can add custom fonts in one of two ways:

• Upload your own font files (WOFF2, TTF, or OTF).
• Import fonts from Adobe (requires an active Adobe Creative Cloud subscription).

1. Open the Website Builder. From the left toolbar, click the Settings icon, then select All settings.
   
   
   
2. Your general website settings will open. Under Features, click on Themes. 
   
   
   
3. On the main page, scroll to the Custom fonts section. 
    
4. Click on Choose files or drag and drop to select your files.

• You can upload up to 10 custom font families.
• Accepted formats: WOFF2, TTF, or OTF files.
• Max file size: 1 MB per file.

5. After selecting your font file, you’ll be asked to acknowledge that you have the rights to use the fonts you uploaded. Click I acknowledge to proceed.    
   
   
   

5. Once uploaded, your fonts will appear in the Custom fonts list with preview text to help you identify each font.
   
   
   
6. To remove a font, click the trash can icon next to it. 
   
   
   
7. You’ll be asked to confirm that you want to delete your font. This action cannot be undone, and the font will be removed anywhere it’s used on your published site or in the Website Builder. Click Delete to confirm. 
   
   
   

To use Adobe fonts with beehiiv, you must have an active Adobe Creative Cloud subscription.

To get started, you will need to be logged into your Adobe account, then we’ll guide you through importing fonts into beehiiv. Click on the image to follow this interactive walkthrough or reveal the written steps below for the complete process.

Show steps for adding Adobe fonts
 
1. Begin by logging in to your Adobe account. Please note that an active Adobe Creative Cloud subscription is required to add Adobe fonts.
   
   
   
2. Then, click the Apps option to access Adobe's full suite of creative applications.
   
   
   
3. Scroll through and view any of the fonts shown. When you've found one you like, click on the font card.
   
   
   
4. This will open the font details and let you test the font using your own text.
   
   
   
5. When you find a font you want to use on your website, click Add to Web Project to add this font to your project.
   
   
   
6. A pop-up will appear, click the dropdown to name or select a project.
   
   
   
7. Then, click the Create button to finalize adding font(s) to your website project.
   
   
   
8. A pop-up will appear and provide you with the embed code. Click the icon to copy the code, then click Done.
   
   
   
9. You can repeat the same process to select other fonts for your website and add them to the same project.
   
   
   
10. Then, head over to your beehiiv account and select Website, then the Builder option to access your Website Builder dashboard.
    
    
    
11. In the website editor, click the Settings (gear) icon to access the website settings.
    
    
    
12. Then click All settings.
    
    
    
13. From here, click Themes.
    
    
    
14. Then, scroll down to the Custom fonts section.
    
    
    
15. Paste your Adobe Fonts embed code into this field to import custom fonts.
    
    
    
16. Afterwards, click the Import button to proceed with adding your Adobe Fonts.
    
    
    
17. A pop-up will appear. Please review the Adobe Fonts license acknowledgment to confirm subscription rights and legal usage.
    
    
    
18. Then, click the I acknowledge button to confirm your Adobe Fonts license agreement and proceed.
    
    
    
19. When your font has been added, you'll see it in the preview in the Custom fonts section.
    
    
    
20. Click the back arrow to return to the Website Builder and begin using your custom font.
    
    
    
21. Within the editor, highlight the heading or paragraph block where you'd like to use your custom font.
    
    
    
22. Then, click on the Font in the right panel to open the typography options.
    
    
    
23. From here, you can either select Custom and assign your custom font to the text.
    
    
    
24. Or click Edit Theme and assign your custom font to the Header, Body, and Button fonts. Then apply all your theme fonts and update your website pages at one time to use the Adobe font.
    
    
    

Once added, custom fonts can be applied anywhere in the Website Builder.

1. Open the Website Builder and navigate to the page you want to edit.
    
2. Select a heading or paragraph block on the canvas.
    
3. In the right panel under Style, click the Font field to open typography options.
   
   
   
4. Select Custom, then choose one of your uploaded fonts.

• Use Search to quickly find a font.
• Use On this page to reuse fonts already applied elsewhere.
  
  
  

5. (Optional) To apply a custom font site-wide, click Edit Theme and assign the font to your Header, Body, or Button typography settings. Then click Apply to update your website pages.
   
   
   
6. Once your custom fonts are in place, click Publish in the top-right corner of the builder to make your changes live.

• Choose This page only to publish page-specific changes.
• Or select All pages to publish broader site updates.
• Then, click Publish to live site to finalize.   
  
  
  

Can I use the custom fonts I've added to the Website Builder in the Post Builder?
No. Custom fonts apply only to your website. Custom fonts aren’t currently supported in the Post Builder, welcome emails, or automation emails.
How many custom fonts can I upload?
You can upload up to 10 custom font families per account.
What happens if I downgrade my plan?
If you downgrade from a Max or Enterprise plan:
• All custom fonts will be removed from your website.
• Any areas using those fonts will fall back to the default theme font.
Who is responsible for font licensing?
The beehiiv account owner is responsible for:
• Confirming they have the right to use uploaded fonts.
• Maintaining proper licensing based on usage (including web usage terms).
Can I apply custom fonts without using theme settings?
Yes. You can apply custom fonts directly to individual text blocks, or assign them globally through your theme settings; both options are supported in the Website Builder.
Where can I find custom fonts?

Custom fonts are available from many sources. If you’re new to managing font files, we recommend reviewing Google’s guide: Installing and managing fonts.

Always use caution when downloading font files and ensure you’re sourcing fonts from reputable providers.