Hi! Can anyone please help me, this is my homepage menu with everything in white. and I want all my other page headings to be like the 2nd image. and the 3rd image is the one I got as a result. I use dawn theme.
2nd image
3rd image
Topic summary
A user working with Shopify’s Dawn theme wants a white logo on the homepage while displaying a black logo on all other pages (excluding sticky header behavior).
Solution Provided:
Another user shared CSS code to be added at the end of the base.css file:
body:not(.template-index) .header__heading-logo { filter: invert(1); }
Current Status:
- The original poster confirmed the solution works successfully
- A follow-up issue emerged: the CSS works on desktop but not on mobile devices, where the logo needs the same invert effect
- Another user reported the code didn’t work for them despite adding it to the last line of
base.css, requesting a screenshot for clarification
The discussion remains open with unresolved mobile responsiveness and implementation questions.
@sweetchin23 - can you please share this page link?
https://halo-m.com/account/login
pw: yiflow
Thank you
@sweetchin23 - try this css for logo and check, add it to the end of your base.css file and check
body:not(.template-index) .header__heading-logo{filter: invert(1);}
Thank you so much! 
It works.
1 Like
@sweetchin23 - welcome
1 Like
Hello! This works on my site, however on phone it does not work. The logo is the same on desktop and phone and I need it to invert like on desktop. How can I do that? Thanks in advance 
For some reason this is not working. Can you screenshot how it should in base.css file? I put it on the last line but it did not change for me.