Chykalophia Docs
Squarespace

Changing your logo & site title

How to update your logo image, site title, and browser icon in Squarespace so your branding appears consistently across every page.

Time
5 minutes
Difficulty
Beginner
You’ll need
Your logo file · Your Squarespace login

Your logo and site title appear in your website's header on every page. This guide shows you how to update both so your branding is accurate and current.

Quick summary

Click Edit on any page, hover over the header, and click Edit Site Header. Then click your site title or logo, and click the pencil icon to change them. Your changes go live when you click Save.

What you'll need

  • Your logo file, ideally a .png with a transparent background. Squarespace accepts .jpg, .gif, .png, and .webp images, but not SVG files.
  • Access to your Squarespace dashboard as the site owner or an administrator (other contributor roles can't change the logo or title)

Opening Logo & Title settings

On Squarespace version 7.1, your logo and site title are part of your site header.

Log in and open the Pages panel.

Click Edit in the top-left corner of your site preview.

Hover over the header and click Edit Site Header.

Click your site title or logo, then click the pencil icon. The settings panel opens.

On an older version 7.0 site, open the Design panel and click Logo & Title instead.

Changing your logo image

In the settings panel, find the Logo Image section. There's a separate Mobile Logo Image section if you want a different logo on phones.

Click + to add an image. Choose Upload File to use a file from your computer, or Select From Library to reuse an image you've already uploaded. If a logo is already there, click Replace under it.

Upload your new logo file. A .png with a transparent background is the best format for logos.

Adjust the logo size with the height sliders. There's one for computers and one for mobile.

Click Save.

Logo file tips

Use a .png file with a transparent background so your logo sits cleanly against any header color. Squarespace doesn't accept SVG files, so a large, good-quality .png is your best option. Avoid .jpg for logos, as it doesn't support transparency. For the same reason, don't edit your logo in Squarespace's built-in image editor: it saves the image as a .jpg and the transparency is lost.

Changing the site title

The site title is the name of your site. It shows in your header if you haven't added a logo, and it can also appear in browser tabs, search results, and social shares, depending on your SEO settings.

Open the header settings as described above.

Edit the Site Title field to match your current business name. Site titles can be up to 120 characters long.

Click Save.

Keep a site title filled in even if you use a logo. Squarespace uses it as the logo's alt text, and search engines can show it in results.

Changing the tagline

Taglines are only available on older version 7.0 sites. On those, you'll find the Tagline field in Design > Logo & Title, and it only appears with some templates. Version 7.1 doesn't support header taglines.

Showing logo vs. site title

Squarespace shows either your logo or your site title in the header, never both. Once you upload a logo, it replaces the site title. If you want your business name next to your logo, use a logo image that includes the name.

Updating the favicon

The favicon is the tiny icon that appears in browser tabs and bookmarks. It's usually a simplified version of your logo.

To update it, open the Favicon panel, which you'll find in your site's Settings (the gear icon at the bottom of the main menu). Upload a square image: Squarespace recommends a .png between 100×100 and 300×300 pixels, and the file can't be larger than 100 KB. You can also add a separate version for dark mode.

Browsers hold on to old favicons, so if the new one doesn't show up straight away, clear your browser's cache.

Common questions

My logo looks blurry. What's the problem?

The logo file is probably too small. Squarespace resizes your logo to fit, and small images can look pixelated when they're resized. Upload a larger version of the file. Since SVG files aren't accepted, a large .png is the best choice.

My logo has a white box around it even though I used a PNG. Why?

This usually means the PNG file wasn't exported with a transparent background. Ask whoever created the logo file to re-export it as "PNG with transparent background." It can also happen if the logo was edited in Squarespace's image editor, which removes transparency. Your designer or Chykalophia can help with this.

The logo size looks different on mobile. Can I fix this?

Yes. The logo settings have a separate height slider for mobile, and you can upload a different Mobile Logo Image if you need to. While editing the header, click the mobile icon in the top-right corner to check how it looks on a phone.

Need a hand?

If you're stuck, email support@chykalophia.com and we'll help. Include your website address and a screenshot if you can.

Learn more

Last updated

On this page