Good design is subtle and is often the result of lots of small details. One of my favorite small details to add to websites is a custom favicon.

What is a Squarespace Favicon?

So, what exactly is a favicon? The word “favicon” is short for “favorite icon”. See that tiny little graphic that appears in your browser tab next to the page title? That’s it! This little graphic is a simple yet effective way to draw attention to your website and brand. If you have multiple tabs open in a browser, the favicon serves as a quick way to tell websites apart.

Not only are favicons a cute detail, they also add a level of professionalism. Websites without a favicon will default to the generic icon. This default generic icon is an immediate giveaway of a newbie business or amateur website which is absolutely something you want to avoid. Your favicon should be simple, but consistent with your brand so when your visitors see it they immediately associate it with your business.

But…how to do I make one and where do I put it? Luckily, making your own favicon is quite simple. Check out the video below to learn how to make your own favicon in Canva and how to upload it into your Squarespace Website.

How to Make a Favicon for Squarespace

Squarespace Favicon Design

• Favicons display in browser at 16px x 16px

• Squarespace recommends dimensions be square between 100px and 300px

• .png files with transparent background are optimal

• Keep the design simple! Remember that favicons will appear very small so overly detailed designs aren’t going to appear nicely. I recommend using initials, simple and solid graphics, with bright colors.

How to Upload Your Squarespace Favicon

• Login to your Squarespace website.

• For 7.0 sites — Navigate to Design > Logo & Title > Browser Icon (favicon)

• For 7.1 sites — Navigate to Design > Browser Icon

• Upload your file

• Save

• Open the website in a new browser tab