So you’ve designed all of your Squarespace pages and you LOVE them, until you realize that your logo isn’t showing on some of the pages because of the menu bar color. So how do you change logo color on one page in Squarespace? It’s easy with this little code trick.

Please note that this article was written with Squarespace 7.1 in mind.

This video is part of my Squarespace 7.1 crash course, which you can learn more about here.

How to Change Logo Color on One Page

Again – this is SO easy. All you’re going to do is take the code below and put it in the page settings of any page you need the different color.

Code:

<style>
.header-title-logo img {
    -webkit-filter: invert(100%);
   filter: invert(100%);
  filter:progid:DXImageTransform.Microsoft.BasicImage(invert=’1′);
  }
</style>

Where to add the code:

This code goes in the page settings. To open this up, hover over the page name in your lefthand menu and click on the gear icon that appears.

change logo color on one page

In the window that opens up, select the Advanced tab:

change logo color on one page

In the next window that opens up, paste your code – and you’ll see that the logo color changes on the page.

Resources mentioned in the video:

Squarespace ➡️ https://www.kcocreative.com/squarespace

Squarespace 7.1 Crash Course ➡️ https://kcocreative.academy

Best of luck! Xx, Kara

Ready for more?

Be sure to check out and subscribe to my YouTube channel. You can also view SkillShare courses (and a free two-week trial) here.

✨ Ready for the DIYer’s dream? Check out Website Launch Bootcamp, where a website designer (me!) and an ethical copywriter (Lauren Van Mullem) teach you brand strategy, ethical copy for coaches and website design in one nifty (and affordable!) package. ✨

Affiliate links! I only promote services that I have used myself, regardless of whether I have an affiliate account with them, and using affiliate links when available helps me to continue to provide useful information at no cost to my viewers/readers/peeps. Thank you 🥰