Uploading custom fonts

false

Uploading custom fonts

Last updated March 30, 2026 19:55

Personalize your site with custom fonts to match your brand

To use a font that’s not already available on Squarespace, upload it in site styles to use anywhere on your site. This is a great way to enhance your brand beyond our built-in font options.

Ensure you have all necessary permissions from the owner or licensor of the font to use it on your site. For more details, review our best practices. To use Squarespace's built-in fonts, visit Changing fonts.

Watch a video

Upload a custom font

After you upload a font, it appears as an option in any font tweak. How to upload a custom font depends on your site’s version.

To upload a custom font:

  1. Open the Site styles panel, then click > next to Fonts.
  2. Click a font format, like Headings, Paragraph, or Buttons.
  3. Click the font dropdown menu, then click the upload icon.
  4. Click and drag the file from your computer into the upload area, or click + and select the file to upload.

To upload a custom font:

  1. Open the Design panel, then click Site Styles.
  2. Click a font tweak, then click the font dropdown menu.
  3. Click the upload icon.
  4. Click and drag the file from your computer into the upload area, or click + and select the file to upload.

Supported file types

Upload your custom fonts as one of the following file types:

  • .otf
  • .ttf
  • .woff
  • .woff2

Can I use variable fonts?

You can use variable font files that include multiple weights, but font files with multiple styles aren't supported at this time. To use other styles of a specific font, upload each as a separate file.

Use a custom font on your site

To use a custom font you’ve uploaded:

  1. Find a font tweak in site styles and click the font dropdown menu.
  2. Your custom fonts display under Uploaded. Select the font you want from the list or use the search bar to find it.

Delete custom fonts

To delete a custom font:

  1. Ensure the font you want to delete isn’t in use on your site. Change any tweaks to other fonts and save your changes first.
  2. Find a font tweak in site styles and click the font dropdown menu.
  3. Next to Uploaded, click Manage.
  4. To delete a font and all its styles, click … beside the font name. To delete a specific style of the font, click X beside the style name.

Best practices for font licenses

Note: These best practices are a resource, but they’re not legal advice. We recommend working with a legal expert for specific guidance about your website or business and its font licensing needs.

Before you upload a custom font, ensure you have the necessary rights and permissions to use it on your site. Fonts are typically licensed by font owners (or foundries) either directly to customers or via aggregated font licensors. Font license agreements provide details about how and where you can use the font. Licensing arrangements vary greatly and it’s important that you understand any usage requirements and limitations included in your purchase order or license agreement.

For example:

  • Your license may give you the ability to use all the fonts in a particular font family, or your license may only allow usage of an individual font in that family.
  • Some licenses cost more or less depending on the number of monthly visitors to a site where the font is being used.
  • Dynamic webfont serving might have a different cost or license structure than usage in static assets or in a logo.

Be cautious. Even if a custom font can be freely downloaded, the provider may still require the purchase of a paid license to‌ use the font on a site or in another public-facing manner.

Consult your agreement with the font provider before uploading any custom fonts to your site. It’s your responsibility to ensure you have secured all necessary rights and permissions for your intended use of the font.

Add a custom Adobe Font (version 7.0 only)

In Squarespace version 7.0, you can use our integration with Adobe Fonts to add custom fonts.

  • This process replaces font options in site styles with the fonts in your custom project. Squarespace's Adobe Fonts won't be available for use while your custom Adobe Fonts project is enabled.
  • Custom fonts are available with an Adobe Creative Cloud subscription. Before subscribing, choose a plan that includes Adobe Fonts.

Step 1 - Create a web project and add fonts

To add your custom fonts to version 7.0 sites, you’ll first create a web project in Adobe. Log into your Adobe Fonts account, then follow their steps for creating a web project.

After creating your web project, your customized HTML embed code will display. You won't need it, so don't add it to your site. Instead, use the next step to get the project ID, which is shorter.

Step 2 - Add your custom fonts to Squarespace

When your web project includes all the fonts you need, add the project to your Squarespace site using the project ID:

  1. In your Adobe Fonts account, click My Adobe Fonts in the top-right corner.
  2. Click Web Projects, then find the project you want to add to Squarespace.
  3. Copy the Project ID, which is a string of letters and numbers above the embed code. Ensure that you copy your unique Project ID, and not the one shown in the example.

Project ID highlighted with blue box

  1. Open the Developer tools panel .
  2. Click External API keys.
  3. Scroll down to the Adobe Fonts Project ID box.
  4. Paste the project ID you copied from Adobe into the box.
  5. Click Save.

Step 3 - Use your Adobe Fonts

After adding Adobe Fonts, you can apply them to text on your site. The fonts in your web project replace the built-in fonts in site styles. To quickly find a custom Adobe Font, search for it by name in the Search box.

If you change your Adobe Fonts, republish to show these changes on Squarespace. To learn more, visit Adobe's documentation.

Error message: “Unsupported Fonts” in site styles

This message displays if your site is using a font that Adobe Fonts retired. When the font is no longer supported, we'll replace it on Squarespace with the closest match available. Review the style sections listed in the error to approve or change the replacement font.

Adobe Fonts will also remove any retired fonts from your Adobe Fonts page.

My custom Adobe fonts aren't displaying on my site

If some special characters aren't displaying properly, edit the Web Project and select All Characters before adding the project ID to Squarespace.

If none of your fonts are displaying, check your site for any JavaScript. If you ever used Adobe Fonts' JavaScript method to add fonts to your site, your fonts may not load properly. Remove the JavaScript and follow the steps above to add your Adobe Fonts.

Where to go for support

If you're having trouble adding your Adobe Fonts project ID, or if Adobe fonts aren't appearing in your site, contact us and we can help you troubleshoot. For all other questions about using Adobe Fonts, contact them or visit their documentation.

Was this article helpful?

Yes No

0 out of 0 found this helpful

Yes No

Uploading custom fonts