Can I Choose Whatever Font I Want to Use on Squarespace?

What Fonts Are Available on Squarespace?

Squarespace pulls fonts from three sources, giving you a combined library of over 1,600 options.

Google Fonts (600+)

The majority of Squarespace's built-in font library comes from Google Fonts - a free, open-source collection. These fonts are optimized for web use and load quickly. Popular choices like Montserrat, Open Sans, Lato, Playfair Display, and Roboto are all available directly in the font picker.

Adobe Fonts (1,000+)

Connect your Adobe Creative Cloud account to unlock over 1,000 additional premium fonts. Go to Design > Fonts > Adobe Fonts to connect. Once linked, Adobe fonts appear alongside Google Fonts in the picker. This includes professional typefaces from foundries like Adobe Originals, Monotype, and others not available through Google Fonts.

System Fonts

Squarespace also includes web-safe system fonts (Arial, Georgia, Helvetica, Times New Roman) that load instantly because they are already installed on most devices. These are reliable fallback options.

How to Change Fonts on Squarespace

The process differs slightly between 7.0 and 7.1, but the core steps are the same.

On Squarespace 7.1

Go to Design > Site Styles > Fonts. Click on any font category - Headings, Paragraphs, Buttons, or Miscellaneous. Click the font family name, then Browse All Fonts. Search by name or scroll the list. Select a font. Adjust weight, size, letter spacing, and line height. Click Save.

On Squarespace 7.0

Go to Design > Site Styles. Find the typography section for the element you want to change (heading, body text, etc.). Click the font family dropdown and Browse All Fonts. Search or scroll to find your font. Save your changes.

Searching for a Specific Font

Use the search bar at the top of the font browser. Type the exact font name. If it appears, select it. If it does not appear, the font is not in Squarespace's built-in library - but you can still use it via custom upload (covered below). For font pairing ideas, our guide to best Squarespace fonts covers combinations for every brand style.

How to Add a Font That Is Not in Squarespace

If your desired font is not available through Google Fonts or Adobe Fonts, you can upload it manually.

Step 1: Get the Font File

You need the font in WOFF2 format (best) or WOFF. Convert TTF or OTF files using Font Squirrel's free Webfont Generator. Verify you have a web license for the font - many desktop fonts require a separate license for web use.

Step 2: Upload to Squarespace

Go to Design > Custom CSS. Click Manage Custom Files below the CSS editor. Upload your font file. Click the filename - Squarespace inserts the file URL. Copy this URL.

Step 3: Declare with @font-face

Add this CSS to the Custom CSS editor:

@font-face {
  font-family: 'YourFontName';
  src: url('YOUR-FILE-URL.woff2') format('woff2');
  font-display: swap;
}

Step 4: Apply to Elements

h1, h2, h3 { font-family: 'YourFontName', sans-serif; }

This applies your custom font to headings. Adjust the selectors for body text, buttons, or specific elements. For the full upload walkthrough, our guide to finding fonts on Squarespace covers every method. For advanced customization and features on Squarespace, Custom CSS opens up significant design possibilities beyond the built-in options.

Important Font Considerations

Fonts Display Differently Across Devices

The same font can render slightly differently on Windows vs Mac, Chrome vs Safari, and desktop vs mobile. This is due to different font rendering engines. Always test your font choices across multiple devices and browsers. Differences are usually subtle but noticeable on decorative or thin-weight fonts.

Font Retirement

Google and Adobe occasionally remove fonts from their libraries. If your site currently uses a retired font, it continues to work - the font is already cached. However, if you switch away from it, you cannot switch back. Squarespace will suggest a similar replacement, but it will not be identical.

Performance Impact

Each font you load adds to your page weight. Using 4-5 different fonts slows page loading noticeably. Stick to 2-3 fonts maximum: one for headings, one for body text, and optionally one for accents. Custom uploaded fonts add more weight than built-in fonts because they load from your site instead of a cached CDN.

Font Licensing

Google Fonts are free for any use. Adobe Fonts are licensed through your Creative Cloud subscription. Custom fonts may require purchasing a web license separately from a desktop license. Using a font without the proper license can result in legal issues.

Can You Use Different Fonts on Different Pages?

Yes, with Custom CSS. Target a specific page using its collection ID and set a different font-family for that page. However, using different fonts across pages creates inconsistency that can confuse visitors and weaken your brand. Reserve per-page fonts for genuinely different contexts - like a portfolio page with a creative display font vs standard body font on service pages. For per-page styling, our guide to setting different styles per page covers the full process.

Choose From 1,600+ Fonts or Upload Your Own

Squarespace's built-in library covers most font needs. Connect Adobe Fonts for premium options. Upload custom fonts with CSS for anything else. Stick to 2-3 fonts, verify licensing, and test across devices for the best results.