5 Font Pairings for Your Squarespace Website

What the FONT?!

Along with a killer color palette, choosing fonts for your websites is another very important task. Long story short, having too many fonts or using them in the wrong way can work against your awesome content and offerings. Having a few great fonts that work together will create hierarchy on your website and help lead your dream clients with ease and beauty! All of the following font pairings are fonts that can be found in Squarespace! I hope they inspire you!

PS - Scroll down past the pairings to learn a little more about how fonts work in Squarespace 7.0 and how you can use these if you aren’t sure.

 
5 font pairings for your squarespace website
5 font pairings for your squarespace website
5 font pairings for your squarespace website
5 font pairings for your squarespace website
5 font pairings for your squarespace website
 

How fonts work in Squarespace

A quick breakdown of how fonts work on Squarespace (7.0). You get to choose 4 different font stylings!

Heading 1 (h1)

This should be your most dominant font, biggest font and have big keywords in it for SEO purposes.

Heading 2 (H2)

H2 is usually the font I end up using the most throughout a site. I put longer sentences in it to break up text and use it to paired with H1 or H3.

Heading 3 (H3)

I like to think of H3 as a little “explainer” or “category” type. For instance, on my homepage I have a headline in H1 that says “CUSTOM #BOSSLADY SITES” and above that there’s a little explainer that says “THE LATEST” in H3. It makes a nice hierarchy of type and also signals to my readers that this section is my newest work.

Normal

And then we have your normal font - your body copy font. This is what all your blog posts are in, all the normal text on an about page, etc. To be honest, it’s very rare that I don’t use Proxima Nova… it’s just the perfect normal font!

How to use / change font styles?

  • Add a new text block to any of your pages

  • Type in your text

  • Select the text you want to change to H1, H2 or H3 and select the style you want in the text editing bar

  • Go to your site styles and click on the style to make changes (different font family, color, size, etc)

Here’s a quick video to walk you through!


related posts

 
 
Previous
Previous

Squarespace Template: Lit + Fit

Next
Next

The most powerful organization tool in Squarespace