Add a favicon or browser icon

false

Add a favicon or browser icon

Last updated August 05, 2026 18:05

Represent your brand with a custom favicon.

A favicon, or browser icon, is a small square image that displays next to a page's title in browser tabs and in other places across the web. Adding a custom favicon makes your site recognizable in a browser full of tabs or bookmarks.

Watch a video

Add a favicon

To add a favicon:

  1. Open the Favicon panel.
  2. Drag your image into the image uploader, or click the uploader to choose a file from your computer.
  3. Optional: Add an alternate version of your favicon that displays when visitors view your site in dark mode. It's not possible to add a dark mode favicon without first adding a default favicon.
  4. After your images upload, click Save.

Best practices for favicon design

Follow these best practices when designing and formatting your favicon:

  • Image resolution - Though they display at 16px x 16px, favicons work best across browsers when uploaded between 100px x 100px and 300px x 300px.
  • File format - We recommend .png files. It's not possible to upload an .icon file.
  • File size - Favicon image files can't be more than 100 KB.

How favicons display

Generally, favicons appear in browser tabs, but they may display differently depending on your browser or device:

  • In Safari, the favicon appears when you click the address bar or if you open multiple browser tabs.
  • Safari may display your favicon with a border or background color to ensure better contrast. This can happen in both light mode and dark mode depending on the brightness and color of your favicon.
  • Usually, the favicon doesn't display on mobile browsers.

What happens if I don't add a favicon?

All Squarespace sites start with our default cube favicon. If you don't add your own favicon, people who know the icon will recognize that you're part of the Squarespace community.

Favicon

Why isn't my favicon displaying on my site?

If your favicon doesn't update right away, we recommend clearing your browser cache and restarting your browser. Browsers can be very persistent in holding on to cached favicons.

How do I make my favicon appear in search results?

Some search engines may display your favicon when your site appears in search results, but different search engines have different requirements. For example, Google requires that your favicon be a multiple of 48px x 48px, like 48px x 48px, 96px x 96px, 144px x 144px and so on.

To ensure your favicon displays in search results, find the search engine's recommendations for favicon display and format your image to meet those requirements.

Can I upload multi-version favicons?

No. It's not currently possible to use multi-version favicons. To upload your favicon correctly, remove other versions from the file and upload a single version of the image.

Was this article helpful?

Yes No

2432 out of 3300 found this helpful

Yes No

Add a favicon or browser icon