How to add a custom logo to Squarespace

Here's a step-by-step tutorial on how to create and add a custom logo to Squarespace.

In short, we'll go over:

• Exactly the steps to add a custom logo to the Squarespace header
• Best practices for Squarespace logo
• How to resize the Squarespace logo after you've added it
• Common questions about adding a logo to Squarespace

By the end of this tutorial, you will have successfully added a new logo to your Squarespace site.

Let's dive right in.

How to add a logo to the Squarespace header

1. Log in to your Squarespace dashboard and select Edit.

2. Select Edit Site Header.

3. A pop up will show that allows you to edit the header settings, such as changing the site title, logo, style, and or adding other elements to the header navigation.

Select Site title & logo.

4. Upload a custom logo to your Squarespace site.

Pro Tip: How to create a logo for Free

1. Create and customize a logo image using tools like Squarespace logo or Canva.
2. There're some limitations to the logo you download from Canva's free logo maker, such as having a white background, fixed size, etc.
3. Use Remove.bg to remove the background in one click. Transparent background works best on Squarespace.
4. Crop the logo image to the right size (ideally removing excessive white space or background) using free tools like Microsoft Paint (Windows) or Preview (Mac).

You should now see the new custom logo replacing the site title.

Click Done ➝ Save to save the logo changes.

This new logo will now appear on every page of your site. And just like the site title, clicking on the new logo will redirect users to the home page.

Squarespace logo best practices

Here are some recommendations for your Squarespace logo to make sure it looks good, loads quickly, and so you don't run into any errors:

• Make sure the logo image size doesn't exceed 20Mb. Otherwise, it won't be uploaded. However, compress your image before uploading for the best performance (so it loads quickly).
• Squarespace doesn't impose an aspect ratio for the logo. However, keeping your logo in a wide/rectangular format is best. This is because most Squarespace themes have a narrow header by default, which complements a wide logo format.
• Use only letters, numbers, underscores, and hyphens for your logo file name.
• Create a logo dedicated to mobile users since Squarespace allows you to upload a separate logo that is optimized for mobile devices.

How to resize the header logo for Squarespace

Squarespace now offers a way to quickly resize your logo once you've uploaded them in the Site title & logo setting.

You no longer need to use custom code to manually adjust logo size in Squarespace!

To make the Squarespace logo bigger or smaller, simply drag the slider under Logo Height, and the logo should adjust in the editor in real time.

You also have the option to resize the Squarespace header logo for mobile:

1. Make sure you toggle the Mobile view in the editor.
2. Hover to the top of the page and click Edit Site Header. Select Site Title & logo and drag the Mobile Logo Max Height slider.
3. The logo in the Mobile view will resize accordingly.

Frequently asked questions about adding a logo in Squarespace

What's the recommended size for the Squarespace logo?

It's best to keep your logo under 5Mb for better loading speed.

As for dimension, Squarespace recommends 2500 pixels width in most cases.

Note that Squarespace will automatically create and choose different versions (often smaller sizes) of your images as part of their built-in responsive design to optimize the user experience on different devices.

Why is the Squarespace logo so small?

Squarespace automatically resizes your logo to fit the default header layout, which is often narrow. This is why the logo appears to be small.

How do I make the Squarespace logo bigger?

Squarespace has made it easy to resize your logo in the Site title & logo setting.

Just drag the slider in the logo editor, and the logo will resize accordingly.

How do I add both the logo and title in Squarespace

As of this writing, Squarespace doesn't allow you to display the title and logo simultaneously.

One way to do this is to include your site title in the logo and upload that logo instead.

How to get back the site title?

To get back the site title, simply remove the logo you've previously uploaded.

Related articles

• How to create a custom 404 page in Squarespace
• How to add reviews to Squarespace
• How to change font in Squarespace
• How to redirect a page in Squarespace
• How to change template in Squarespace
• How to duplicate a page in Squarespace
• How to add a button in Squarespace
• How to add Google Analytics to Squarespace
• How to display PDF on Squarespace

David Nge

David is the founder of MakingThatWebsite.com and started making websites for businesses back in 2014. He's a keen learner and wants to share his journey and knowledge with other business owners and freelancers. He launched MakingThatWebsite.com in 2021 to make website building more approachable and scalable for businesses.

Have a tutorial you want to learn? Leave a suggestion here.