Contents
  1. The short answer
  2. Which asset this means
  3. Older guidance, including 2019 advice
  4. Preparing the favicon from vector artwork
  5. Vector source versus raster upload
  6. Permission to adapt a logo

The short answer

A Squarespace favicon, which the platform calls a browser icon, should be a square image with enough resolution that Squarespace and the browser can scale it down cleanly. Browsers usually show favicons at very small sizes, such as 16 × 16 pixels in a tab and somewhat larger in bookmarks or shortcuts. The size you upload matters less than whether the design is square and still recognizable when it is reduced to a few pixels.

Evidence gap: the sources for this article did not confirm Squarespace's current recommended upload size in pixels, its accepted file formats, or its file-size limit. Check Squarespace's own help documentation or the browser icon panel in your site settings for those figures before you export. Do not rely on a number quoted elsewhere without checking it there.

Which asset this means

The favicon is the small icon shown in browser tabs, bookmarks, history lists and some search or shortcut views. In Squarespace it is uploaded separately from the main site logo. It is a compact symbol, not a smaller copy of the header logo.

In logo-system terms, the favicon belongs to the compact symbol variants: a monogram, an initial, or the standalone mark from a combination logo. A full horizontal lockup with a wordmark is usually too wide and too detailed to read inside a small square.

Older guidance, including 2019 advice

People often search for older favicon advice for Squarespace, such as figures from 2019. Squarespace has changed its platform versions and settings interface over time, so older tutorials may describe different menus or different recommended dimensions. We found no confirmed evidence of which older figures still apply. Use the guidance that appears in your site's current settings.

Preparing the favicon from vector artwork

If your logo exists as true vector artwork, you can export a sharp raster image at whatever square size Squarespace asks for, so you are not limited to enlarging a small file. A filename or extension such as .svg, .ai, .eps or .pdf does not prove the file contains editable vector paths. These formats can also hold embedded raster images. Open the file in a vector editor and confirm that the symbol is made of paths before treating it as scalable source artwork.

  • Use a square artboard so the icon is not stretched or cropped unpredictably.
  • Use the simplest version of the mark, without the wordmark, taglines or fine detail.
  • Leave a small, even margin around the symbol so it does not touch the edges.
  • Thicken thin strokes and enlarge small counters that would fill in at tab size.
  • Check contrast against both light and dark browser themes. A transparent background can make a dark mark disappear on a dark tab bar.
  • Export a raster file, such as PNG, in the format Squarespace's upload panel accepts. Keep the vector master for future changes.

Before uploading, preview the exported image at a very small size, roughly the size of a browser tab icon. If the mark is not recognizable there, simplify the artwork rather than raising the export resolution. Extra pixels do not help once the browser shrinks the image.

Vector source versus raster upload

Item | Role | Practical note
Vector master (paths) | Editable source for the symbol | Lets you redraw, simplify and re-export without quality loss
Vector file with embedded image | Looks like a vector file but holds pixels | Cannot be scaled cleanly; treat it as a raster file
Exported raster favicon | The file uploaded to Squarespace | Should be square and simplified for small display
Raster preview or thumbnail | Low-resolution reference only | Not suitable as a source for a sharp favicon

Being able to download a logo file is not the same as having permission to change it or use it as a favicon. Turning a logo into a cropped or simplified symbol is a modification. Any typefaces in the artwork and the trademark itself may have their own license or usage terms. If the logo is yours or your client's, follow the brand guidelines. If it belongs to someone else, get permission before adapting it.