How do you make your logo white but only for HOME PAGE for destop, tablet and mobile version

Topic summary

Goal: Make the homepage logo white on desktop, but black on mobile/tablet; ensure header/menu colors remain consistent.

Approaches suggested:

  • Edit theme.liquid and paste code under the tag to target device-specific styles. A screenshot was shared; exact code not visible here.
  • Change the header logo based on template with a small code snippet and a YouTube tutorial. Again, the precise code is not shown in the thread.

Update after implementation:

  • The change “worked,” but the mobile menu turned black. The requester wants the mobile menu to be white. A screenshot illustrates the unintended menu color change; this image is central to the issue.

Latest development:

  • The helper noted the site appeared down and proposed an alternative code solution (content not visible in the post).

Status:

  • Unresolved. Next steps likely involve adjusting CSS in theme.liquid (or template-specific code) to set different logo colors by device while preserving mobile menu color (white). Key outstanding question: the exact CSS/markup needed to avoid affecting the mobile menu when changing the logo color.
Summarized with AI on December 28. AI used: gpt-5.

My logo is currently white on home page but for destop version only. I would like it to be black on mobile and tablet version. Please help!

www.constructionlayers.com
PW: CollectionThree

Hey @clayinfo ,

Go to your theme’s “Edit Code” Option, then in the search bar type “theme.liquid”
Below the tag “” tag paste the following. Screenshot attached for reference.


Screenshot is for reference only, the correct code to paste is the one shown above.

Hi @clayinfo ,

You can change the header logo based on template using a small code. Please refer the below code and video how to implement the same.


Hope this will helps…

This worked but my mobile menu turned into this. I want it white instead of black

Your website looks like it’s down.

If you can, just try this instead