Adding a Favicon or Browser Icon to Your Squarespace Website
A browser icon, also known as a favicon, is a compact square graphic that appears adjacent to a webpage's title in browser tabs and various locations throughout the internet. Incorporating a customised favicon enhances your website's visibility among multiple open tabs or saved bookmarks.
Every Squarespace website initially features their signature cube favicon. Retaining the default icon enables visitors familiar with the symbol to identify your site as part of the Squarespace network. However, for a more distinctive online presence, you should substitute it with an image that aligns with your site's branding, elevating your website's and overall brand recognition online.
Create your Squarespace Favicon
First off, you need to create a favicon. There are several options for creating a favicon for your Squarespace website, here are some popular options. Once you’ve generated and downloaded your new favicon, you need to add it to your Squarespace website.
Add a favicon
Adding a favicon to your Squarespace site depends on which version of Squarespace your are on.
Adding a Favicon to a Squarespace 7.0 Website
With your website admin panel open in Squarespace, click on Design
Then click on the Logo & Title menu option in the left panel
On the left menu bar the 3rd option down is Browser Icon (Favicon)
Drag your image into the image uploader, or click the uploader to choose a file from your computer.
After your image uploads, click Save.
In case your favicon does not refresh immediately, we suggest emptying your browser cache and relaunching your browser. Browsers tend to be tenacious in retaining cached browser icons.
Adding a Favicon to a Squarespace 7.1 Website
With your website admin panel open in Squarespace, click on Design
Then click on the Browser Icon menu option in the left panel
Drag your image into the image uploader, or click the uploader to choose a file from your computer.
After your image uploads, click Save.
Favicon Best Practices in Squarespace
Image resolution
Favicon images work best across all browsers when sized between 100px × 100px and 300px × 300px, though they display at 16px × 16px. These are the standard favicon dimensions. While some browsers support larger favicon files, all will support that size.
File format
Squarespace recommend using a .png file as the favicon image. They don't support uploading .ico files.
File size
Favicon image files can't exceed 100 KB.
Multi-version favicons
Squarespace don't currently support multi-version favicons. To upload your favicon correctly, use a single version of the image and remove other versions from the file.