How do I make the header different on each page Squarespace?

Hello, could someone provide me CSS code for this adjustment?

I would like to have different logo (white) and different color of menu (also white) on title page only (see attached pic)? the rest should stay the same as it is now

https://stitchingpoetry.com

ps: just to be sure, you will add the code to "page settings - advanced", right?

ps: not sure where to upload the logo? any advice pls?

thank you!!!

I think you could achieve this without code. Since the rest of your site pages are white, you could just make the header theme white in general, and it will have the same affect while also making it white on the home page. But, if you still think you need the CSS code, you can add this to the Page Header code injection of the home page.

<style>
  #header {
      background-color: #ffffff;
  }
</style>

8 hours ago, Caroline_Smith said:

I think you could achieve this without code. Since the rest of your site pages are white, you could just make the header theme white in general, and it will have the same affect while also making it white on the home page. But, if you still think you need the CSS code, you can add this to the Page Header code injection of the home page.

<style>
  #header {
      background-color: #ffffff;
  }
</style>

 

hey caroline, thank you for this, but I would like to have just the menu and logo (that is PNG and I have it) white? background should stay transparent. any advice? thank you again!

On 10/29/2022 at 2:21 PM, lukaserba said:

hey caroline, thank you for this, but I would like to have just the menu and logo (that is PNG and I have it) white? background should stay transparent. any advice? thank you again!

You can add this code to Homepage Header

<style>
  header#header img {
    filter: brightness(0) invert(1);
}
div.header-nav * {
    color: white !important;
}
</style>