How to change fonts on Squarespace

By David Nge • Last Updated: June 13, 2022

Here's a step-by-step guide on how to change the fonts on your site's headings, paragraphs, buttons, site title, navigation and more.

With the introduction of font packs in Squarespace, it's now easier to choose a pre-existing font pairing that looks good already.

But, if you'd like to customize how your site looks, Squarespace provides various options that allows you customize your headings, body text, buttons, and more.

Let's dive right in.

How to change font in Squarespace

First, login to your Squarespace account and select a site to edit.

Select a site to edit
Select a site to edit

On the left panel, select DesignSite Styles.

Select Design
Select Design
Select Site Styles
Select Site Styles

If you're in editing mode, you can head to Site Styles by selecting the brush icon.

Select the brush icon if you're in editing mode
Select the brush icon if you're in editing mode

You'll see the Site Styles drawer pull up from the right.

You should see the site style panel on the right
You should see the site style panel on the right

Select Fonts to start customizing the font style of your site.

Select font from site styles
Select font from site styles

Changing Font Pack

Each Squarespace templates comes with an existing font pack (pre-selected fonts) that is applied to the headings, paragraphs, buttons, and more.

Squarespace font packs help define the default fonts
Squarespace font packs help define the default fonts

You can switch to any other font pack (there are hundreds of them) within Squarespace.

You can switch the default font pack
You can switch the default font pack
Choose from a list of font packs to update
Choose from a list of font packs to update

Once you've changed the font pack, the font style is automatically applied to the rest of the text styles.

Updated font packs
Updated font packs

Changing heading fonts

You have the option to choose a different heading font than the one in the original font pack. Select Headings under Global Text Styles.

Changing the headings font
Changing the headings font

Select font family.

Select font family for headings
Select font family for headings

Notice in this section you can also customize the rest of font style for the headings: the line height, letter spacing, font weight, and font size etc.

Select Browse All Fonts to choose another font option for your headings.

Browse all the headings fonts
Browse all the headings fonts

Select (or search) a font from the font list, in this case I've chosen Proxima Nova, a popular font style for headlines and titles.

Choose from a list of fonts
Choose from a list of fonts
Updated headings font — Proxima Nova
Updated headings font — Proxima Nova

Note: Headings is a global text style, which means this change will apply to all headlines and titles on your site.

Changing Paragraphs fonts

You also have the option to choose a different font for the paragraph (aka body text) than the one in the original font pack. Select Paragraphs under Global Text Styles.

Choose the paragraph global text style
Choose the paragraph global text style 

Select font family.

Choose a font family for paragraph
Choose a font family for paragraph

Notice in this section you can also customize the rest of font style for the Paragraphs: the line height, letter spacing, font weight, and font size etc.

Select Browse All Fonts to choose another font option for your Paragraphs.

Browse all paragraphs fonts
Browse all paragraphs fonts

Select (or search) a font from the font list, in this case I've chosen Monserrat, a popular font style for paragraphs and body text.

Choosing Montserrat for the paragraph font
Choosing Montserrat for the paragraph font

Note: Paragraphs is a global text style, which means this change will apply to all headlines and titles on your site.

Changing button fonts

Lastly, you also have the option to choose a different font for the buttonsthan the one in the original font pack. Select Buttons under Global Text Styles.

Choosing button fonts to update
Choosing button fonts to update

Select font family.

Choose a font family for buttons
Choose a font family for buttons

Notice in this section you can also customize the rest of font style for the buttons: the line height, letter spacing, font weight, and font size etc.

Select Browse All Fonts to choose another font option for your buttons.

Select (or search) a font from the font list, in this case I've chosen Open Sans, a popular font style for call to action buttons.

Browse all buttons fonts
Browse all buttons fonts

Note: Buttons is a global text style, which means this change will apply to all headlines and titles on your site.

Changing fonts for Site Navigation and Site Title

Interestingly, Squarespace also allows you to change the fonts on your site navigation, site title, and how it shows on mobile.

Select Assign Styles from the Font Design panel.

Select assign style to change the site navigation font
Select assign style to change the site navigation font

You can then select the site title or site navigation to change to a different font.

Select one of the options to update the font
Select one of the options to update the font

Choose a custom font for your Site Navigation.

Select a new font for the site navigation
Select a new font for the site navigation

That's it! You can easily change the font for your site title as well using the same method.

Reset font changes

Some times you might get lost while experimenting font choices. Luckily Squarespace provides a quick way to undo all the font changes and revert to the original font style.

Reset font changes
Reset font changes

Just select Reset Font Pack (under Site StylesFonts)to undo all your font changes thus far.