How to Change Your Squarespace Favicon (Step-by-Step)

A favicon is the small icon that sits in your browser tab, bookmark bar, and mobile previews. Often a simplified logo, symbol, or initial, it signals that your website is professional. Leaving it blank can make your website feel unfinished.

If you’re still using the default Squarespace favicon, this guide walks you through the process of changing it, with tips on how to design a favicon that aligns with your brand and meets Squarespace’s requirements.

Note: this post contains affiliate links. If you click and purchase, we may earn a small commission at no extra cost to you. Read our full affiliate disclosure.

Colored notebooks stacked on a desk.

What is a Squarespace Favicon?

A favicon is the small graphic that shows up in a browser tab when someone visits your website. It’s a visual cue that helps visitors identify your site at a glance. You’ll also see it in saved bookmarks or pinned tabs. On mobile, it may appear alongside search results or when your site is saved to a home screen.

Why Add a Favicon to Your Squarespace Site?

It’s easy to overlook the favicon. It doesn’t take up space on your homepage and it won’t affect your page layout, but makes your site feel credible, considered, and professional.

How to Create a Favicon for Your Squarespace Site

Before uploading, design a favicon for Squarespace that feels aligned with your brand. Because of its small size, a simplified version of your logo (or a brand icon that still feels recognisable) is ideal.

Favicon requirements:

  • Size: 48x48 pixels (you can also use 32x32 or 64x64, but keep it square for best results).

  • File type: PNG is preferred, though .ICO and .SVG are also supported.

  • Keep it minimal: Avoid detailed illustrations or text that will blur at small sizes.

Tools You Can Use:

  • Canva: Quick, intuitive, and easy to use even without design experience.

  • Adobe Express (or Photoshop if you’re a professional user): If you want more control over the details.

  • Favicon.io: A handy generator that can convert your image into favicon formats.

If your logo is complex, consider using a single letter or shape that represents your brand rather than the full logo.

How to Upload Your Favicon to Squarespace

To upload your favicon to Squarespace, you first need to login to your website:

  1. Head to Squarespace.com.

  2. Sign in to your account.

  3. Select the site you’d like to update.

This is where you’ll make the change that updates your favicon across browsers, bookmarks, and search previews.

Once inside your Squarespace site dashboard, go to: Settings > Website > Favicon.

Here, you’ll upload the favicon file that will be displayed across browsers, search previews, and mobile devices.

A screenshot of a Squarespace website, showing where the user can upload a favicon to Squarespace.

In the Favicon area, click the Upload Image button and select your favicon file.

If you’ve designed a dark mode version, you can upload it separately, though this is optional.

Tips:

  • Preview your favicon in both light and dark mode.

  • Zoom out to check that it’s clear at a small scale.

  • Test on desktop and mobile for consistency.

The Favicon upload area in Squarespace.

Save and Refresh Your Changes

Once uploaded, click Save in the top left corner.

Your favicon will appear in browser tabs, bookmarks, and anywhere else your website is displayed online. If you don’t see it right away, try refreshing your browser or clearing the cache.

It can take a little time to fully update across all devices.

FAQs

  • Squarespace will use a generic icon if you don’t upload your own. It won’t affect how your site functions—but it does create a small disconnect and makes it harder for users to find and recognize your site among their bookmarks and browser tabs.

  • Squarespace recommends using PNG, ICO, or SVG formats because they support transparency and tend to display more cleanly across browsers. JPGs may appear with unwanted backgrounds or lose clarity at small sizes.

  • Most often, it’s a caching issue. Your browser may still be holding onto the old version. Try refreshing your site in a private window, or clear your cache and check again. It can also take a little time to fully update across all devices.

  • You’ll also see it in bookmarks, pinned tabs, mobile search previews, and even when someone saves your site to their home screen.

Concluding Thoughts

Changing your favicon in Squarespace is simple, but it’s one of those details that makes your brand feel cohesive and complete.


You may also like:

How to Add Custom Fonts on Squarespace 7.1

How to Start Blogging with Squarespace

5 CSS Image Hover Effects to Elevate Your Squarespace Site

Shop Squarespace Templates

Continue Reading

Studio Founded

Studio Founded is an online resource library and design studio for intentional entrepreneurs. As Squarespace Circle Platinum Members and Marketplace Experts, we’ve supported more than 1,000 business owners with design-led templates, strategic workbooks, and bespoke websites. Our approach bridges artistry with strategy, helping you attract aligned clients, refine your offers, and simplify your systems.

https://www.studiofounded.com
Previous
Previous

Squarespace Affiliate Marketing: How to Earn Passive Income

Next
Next

How a Squarespace Website Grows Your Service-Based Business