Creating and Using a Logo in Squarespace

Updated September 2026 · Written and maintained by the Progression Agency strategy team

Two different questions share these search terms. One is how to make a logo using Squarespace’s free tool, which produces a simple wordmark adequate as a placeholder and short of what a growing business needs. The other is how to display a row of client or partner logos on a Squarespace page, which the platform has no dedicated block for. This page answers both, along with the file-format decisions that cause most of the visible problems.

Can you actually make a logo in Squarespace?

Yes, but not in the website builder. Squarespace has run a separate free logo tool, and what it produces is a simple wordmark suitable for a placeholder rather than a finished brand asset.

The distinction matters because people arrive expecting a logo feature inside the site editor and do not find one. What you can do inside the editor is upload a logo file and control how it appears in the header.

What the free tool produces

A text-based wordmark with an optional icon, in a limited set of typefaces and layouts. Adequate as a temporary mark; not a system you can build a brand on.

What it does not produce

A vector master file suitable for print and signage, alternate layouts for square and horizontal contexts, single-color versions, or any usage guidance.

Availability changes

Squarespace has altered the tool’s availability and terms over time. Check the current state on their own site before planning around it rather than relying on any article, including this one.

The licensing question

Read the current terms before using anything generated by a free tool commercially, particularly regarding trademark registration. This is worth checking directly with the provider rather than assuming.

What you upload instead

Most Squarespace sites use a logo made elsewhere and uploaded. The practical requirements for that file are what the rest of this page covers.

How do you add and control a logo in Squarespace?

Through the site header settings, where you upload an image file and set its display size. The exact path differs between Squarespace versions.

Because the interface changes between versions and over time, the reliable instruction is to look for header or site identity settings in the editor rather than to follow a fixed click path from any article.

Find the header settings

Edit the site, open the header, and look for site title and logo options. Version 7.1 and older 7.0 templates present this differently.

Upload a transparent PNG or SVG

Transparency matters because the header background may change with scroll or between pages, and a white box behind a logo is the commonest visible error.

Set the display size deliberately

Squarespace controls logo height in the header. Upload at roughly twice the intended display height so it stays sharp on high-resolution screens.

Check the mobile header separately

Mobile headers have less room and frequently need a different logo variant — a mark alone rather than a full lockup.

Set the favicon too

It is a separate upload, it is what appears in browser tabs and bookmarks, and it is skipped on a large share of sites.

Add the social sharing image

Also separate. It is what appears when somebody shares your page, and leaving it unset means a random or missing image represents you.

What file formats should you use?

SVG where the platform accepts it, high-resolution PNG with transparency otherwise, and never a JPEG for a logo.

A JPEG cannot hold transparency and compresses edges badly, which is why logos uploaded as JPEGs have visible boxes and fuzzy edges around the type.

The practical rule for a small business: keep a vector master (SVG, PDF or AI), export PNGs for web use, and never let the only copy of your logo be a PNG somebody cropped out of a screenshot. That last situation is extremely common and it makes every future print job harder.

What makes a logo work at header size?

Legibility at small sizes, a horizontal proportion that fits a header band, and enough contrast against whatever sits behind it.

Most logos that look poor in a Squarespace header were designed as a square or stacked lockup and are being squeezed into a horizontal space that flatters neither.

Horizontal lockups suit headers

A wide arrangement uses the available space; a tall stacked one forces the header taller or the logo smaller than it should be.

Test at the actual pixel height

A logo at 200 pixels wide is not the same object as the same logo on a presentation slide. Fine detail and thin strokes disappear.

Contrast against a changing background

Headers that become transparent over an image, or invert on scroll, need a logo that works on both light and dark.

Have a stacked variant ready

For mobile, footers and social profiles. One logo file is rarely enough for a real site.

Watch the clear space

Squarespace controls padding loosely. A logo with tight internal margins will look crowded against navigation links.

Should you use a free logo generator at all?

As a placeholder while you build, reasonably. As a permanent brand asset for a business you intend to grow, rarely — because of the file limitations more than the aesthetics.

The binding problem is not that generated logos look generic. It is that you end up without vector artwork, without variants, and sometimes without clear commercial rights, and all three become expensive the first time you need signage or a printer.

For most small businesses launching a Squarespace site, the middle rows are the honest answer: a competent independent designer producing a mark with vector files and two or three variants costs less than one month of most marketing spend and removes a problem you would otherwise hit repeatedly.

Ask for vector files in writing

Before paying. A logo delivered only as PNGs is incomplete, and recovering vectors from a departed designer ranges from awkward to impossible.

Ask what rights transfer

Whether you own the artwork outright, whether the designer may show it, and whether any licensed fonts are included. Font licensing in particular catches people out.

Ask for the variants you will need

Horizontal, stacked, mark alone, single color, and a favicon-safe simplification. Requesting these up front costs nothing extra.

Check originality

Reverse image search the proposed mark and run a basic trademark search before adopting it. Contest platforms in particular carry originality risk.

Do not register a trademark on a free generator’s output

Without clear rights and vector artwork, this is a problem waiting. Take proper advice if trademark matters to you.

What about the logo gallery pages people build in Squarespace?

That is a different question with the same search terms: displaying a row of client or partner logos on a page, which Squarespace does not have a dedicated block for.

The usual approaches are a gallery block, an image grid, or a summary block, each with different behavior on mobile and different amounts of control over spacing.

The single composed image is tempting and is the worst option on mobile, because logos that were legible in a wide row become unreadable when the whole strip is scaled to phone width. Use it only where the logos are large and few.

Normalize the logos first

Client logos arrive at wildly different proportions and weights. Converting them all to a single color at a consistent optical size is what makes a row look deliberate rather than assembled.

Optical sizing beats mathematical sizing

A wide wordmark and a compact circular mark set to the same height look wrong. Size them so they appear equally prominent, not so they measure equally.

Grayscale is the usual answer

It removes clashing brand colors and keeps attention on your page rather than on the strongest logo in the row.

Check you have permission

Displaying another company’s logo generally needs their agreement, and some organizations have specific rules about how their mark may be shown.

Do not imply a relationship that does not exist

A row of logos presented as clients when they are integrations, tools you use, or publications that mentioned you is misleading and is the kind of claim that damages trust when noticed.

Add alt text

Each logo image should name the organization. It is both an accessibility requirement and the only way the content is machine-readable.

Are Squarespace plugins worth using for this?

For a logo row, usually not. The built-in blocks handle it, and a plugin adds a dependency that can break with a platform update.

Third-party Squarespace plugins and code injections are widely sold and they sit outside the platform’s own support. When something breaks after an update, you are dependent on the plugin author’s responsiveness rather than on Squarespace.

Before adding any plugin, check whether a built-in block does the job adequately, and check when the plugin was last updated. An abandoned plugin on a live site is a scheduled outage.

Code injection carries the same risk

Custom CSS and code blocks are not supported by the platform and can break with updates. Keep a record of what you added and why, or the next person will not know.

Check the last update date

A plugin not updated in over a year against a platform that ships changes regularly is a risk you are accepting on behalf of your site.

Test after every platform update

Anything relying on custom code or a plugin should be checked when the platform changes, which means somebody has to own that.

Does a logo affect search visibility?

Not directly, and the file choices around it do: page speed, alt text, favicon and structured data all touch search in small ways.

The honest answer is that no logo will make a site rank. An oversized logo image slowing a page will hurt it, and that is the only meaningful connection.

Compress the file

A logo is small artwork and frequently uploaded as a multi-megabyte PNG, which delays the header on every page load.

Alt text on the header logo

Usually the business name. It is read by screen readers and is what a search system sees where an image carries the site identity.

Add Organization structured data with a logo property

It tells search systems which image represents the organization, and Squarespace does not add it for you.

Set the social sharing image separately

Not the same as the logo, and it decides how your pages look when shared.

What should you do first if you are launching now?

Use a simple placeholder, launch, and commission a proper mark once you know what the business actually is. Do not delay a launch over a logo.

Businesses change substantially in their first year, and a logo commissioned before the positioning settles is frequently redone. A clean typographic placeholder costs nothing and looks considerably better than a rushed permanent mark.

The Squarespace social sharing logo and image, and what size it should be

The social sharing image is what appears when a page is posted to a social platform or a messaging app. Squarespace has a site-wide default and a per-page override, and most sites set neither.

A social sharing logo in Squarespace is the fallback used when a page has no image of its own. It is worth setting because the alternative is the platform picking something arbitrary from the page, or nothing at all — and a link with no preview image is measurably less likely to be clicked.

Squarespace social sharing image size

Platforms crop to roughly 1.91:1, so around 1200 by 630 pixels is the safe target. Keep any text well inside the center, because the crop varies between platforms.

Site default versus per-page image

Set a site-wide default in the settings, then override it on pages that deserve their own. A default is far better than nothing on every page that never gets one.

Social share image examples that work

A clear product or place photograph, a legible title on a plain ground, or a clean logo lockup with space around it. What consistently fails is a busy graphic with small text, because it is seen at thumbnail size.

Why the preview does not update

Platforms cache link previews aggressively. After changing an image, use the platform’s own debugging or sharing tool to force a refresh rather than assuming the change failed.

The social sharing logo, and why your link previews look wrong

One Squarespace setting causes more confusion than any other logo-related question: the social sharing logo. Squarespace uses it as the fallback image when a page from your site is shared to a messaging app or social platform and no other suitable image is available, and because it lives away from the main logo settings, it is frequently never set at all.

The consequence is a link preview showing nothing, showing a stale image, or showing whatever the platform scraped first. Because these previews are cached aggressively by each platform, fixing the setting does not immediately fix existing shared links — the platform continues serving what it stored until its cache expires or is manually refreshed through that platform’s own debugging tool.

A workable social sharing logo example is not simply your logo file. Previews are cropped differently by each platform and are usually displayed small, so a wide horizontal logo with fine detail reproduces badly. A square or near-square version with generous margin, readable at thumbnail size, survives cropping across the widest range of destinations.

Sticky headers, and Google’s ad transparency tools

One CSS pattern and one research resource.

A sticky CSS header keeps the navigation visible as the page scrolls, and it is two lines of CSS: position sticky with a top offset. Sticky headers CSS implementations go wrong in predictable ways — a header that occupies a quarter of a phone screen, anchor links that scroll their target underneath it, and a parent element with overflow hidden that silently breaks stickiness altogether.

Sticky header examples worth copying shrink on scroll, so the full version greets the visitor and a condensed version follows them down. On mobile the honest question is whether it earns its space at all; many sites are better served by a header that returns when the user scrolls up.

Google Ad Transparency is the public library where anyone can look up the advertisements a verified advertiser has run, with the format, the dates and the regions. It is genuinely useful for competitive research: you can see what a rival is actually running rather than what they say they run, and how long each creative has been live, which is the closest available proxy for what is working.

Favicons and plugins on Squarespace

Small platform questions that come up at the end of a build.

How to add favicon to Squarespace: the setting is called the browser icon and lives in the design or site settings area rather than anywhere obvious. Upload a square image at 100 by 100 pixels or larger and the platform generates the sizes. To add favicon Squarespace needs nothing further — a Squarespace add favicon step requires no code, and the common complaint that it has not changed is almost always browser caching rather than a failed upload — check in a private window before troubleshooting.

The design rule matters more than the mechanics: a favicon is read at sixteen pixels, which rules out a full logo for almost every business. What works is a single letter, a simplified mark, or a solid shape in the brand color.

Squarespace plugins free and ghost plugins Squarespace searches reflect a real constraint: the platform has no plugin architecture in the WordPress sense, so third-party extensions are code snippets and scripts injected into the site rather than installed. That means each one is a piece of code you now own, it can break when the platform updates, and several of them together are the most common cause of a slow Squarespace site. A Squarespace site designer worth hiring will push back on adding them.

The practical rule: use the platform’s own features wherever they exist, accept the limitation where they do not, and treat every injected script as a maintenance liability rather than a feature.

Frequently asked questions