Need to swap your logo on a single page of your Squarespace website?

Whether you're working with a light and dark version of your logo or trying to match your branding across contrasting backgrounds, Squarespace doesn’t offer a native feature for per-page logo changes, but with a bit of custom code, it’s 100% possible.

In this step-by-step guide, I’ll show you how to display a different logo on one specific Squarespace page, no plugins, no workarounds, just clean CSS using Squarespace's Code Injection feature.

Why Use a Different Logo on Just One Page?

If your website uses a dynamic color palette, say, light sections on some pages and full-bleed dark images on others, a single static logo might not always be visible. For example:

A white logo may disappear on a white or light background
A dark logo could get lost on a dark or image-heavy section

To maintain brand visibility and improve UX, using a light or dark version of your logo depending on the page background makes perfect sense.

*Want a framework for designing the perfect homepage?*

Access now

Need an expert to build your Squarespace website?

Book a free kick-off call with our team to discuss your project requirements in detail.

Schedule a call

Step-by-Step: How to Add a Unique Logo to One Page in Squarespace

1. Upload Your Alternative Logo

Start by uploading the alternate logo to your Squarespace site:

Go to Custom CSS
Click the image uploader (small image icon) and upload the new logo you want to use for a specific page
Once uploaded, click the file name to copy the image URL

2. Get the Page-Specific Code Ready

You’ll now apply CSS specifically to the page where you want the logo changed.

Navigate to Pages, hover over the target page (e.g. Homepage)
Click the Settings (cog icon)
Go to the Advanced tab

In the Page Header Code Injection field, paste the following CSS:

<style>

.header-title-logo a {

content: url("INSERT LINK");

max-height: 150px !important;

</style>

Replace YOUR-LOGO-IMAGE-URL-HERE with the actual URL of your uploaded logo.

3. Save and Preview

After saving your changes:

Visit the page where you applied the code - your new logo should appear

Navigate to other pages - your default logo will remain unchanged

Final Thoughts

While Squarespace doesn’t yet support multiple logo uploads natively, this simple CSS method gives you full control over your logo appearance across individual pages. Try it out and let me know what you think!