How to edit a Squarespace favicon - 2024 Tutorial
Your favicon is one of the subtle details on your website that will help build brand recognition and make your website look polished, but how do you edit your Squarespace favicon?
This article will break down how to make one and how to add your favicon to your Squarespace website, in 2024.
What is a favicon?
Your website favicon is the little icon/picture that shows in the tabs of your internet browser. It is usually 16x16 pixels in size and represents your website/brand so your website is easily recognisable amongst people’s hundred of open tabs.
The icon will also be visible in other places such as your browsing history, bookmarks bar and search results.
Why do you need a favicon?
The main purpose of your favicon is to help people find your website easily when they have a bunch of tabs open at once. In turn, it is also important for brand recognition by using an icon which represents your brand. It is commonly a submark of your logo.
It simply makes your website look more polished and professional which is especially important for business websites.
What happens if you don’t have a favicon?
If you do not set a website favicon, Squarespace will use their default favicon which is a little grey square/cube. (See screenshot below).
How to make a free favicon using Canva
The great thing about Squarespace is that you don’t actually need to make a 16x16 icon, it will resize it for you.
Squarespace recommends that “icons should be in PNG file format and recommended sizing is between 100 x 100px and 300 x 300px.”
That way, you can hop into Canva and make a 100x100px design - which is much easier to edit than a tiny 16x16 icon!
STEP 1: Go to Canva > Create New Design > Custom Size > 150x150px
STEP 2: Create a SIMPLE icon that represents your brand or icon. This could be a single letter, a graphic or icon. If your logo is particularly complex, I recommend taking one small piece of the logo e.g. one petal from a flower or one letter from a name.
STEP 3: Export as PNG - preferably with a transparent background if you have Canva Premium.
Once you have this saved to your computer, it’s time to upload it into Squarespace.
How to add your favicon to Squarespace
Once you have your favicon saved to your computer, it’s quick and easy to upload this to Squarespace, just follow these next few steps.
STEP 1: Log into Squarespace and head to your website dashboard.
STEP 2: Head to settings > Website > Favicon
STEP 3: Upload the icon you saved to your computer in Canva
STEP 4: Save changes!
STEP 5: Refresh your website to double check it has updated and hey presto, you’re good to go!
I hope you found this tutorial helpful. If you’d like to see more website tips then head over to my blog to see more of my latest tutorials and insights.
Want to work with a web designer who has all these nuances covered? Check out my web design services to see how we can work together.
