Solved

header text color

Cukrovinky
Tourist
22 0 2

Hello, I would like to change color of the text in the header and also change color of the search and cart icon. Thanks

 

https://c31a31-2.myshopify.com/

pass: owhown

Accepted Solution (1)

Spac-es
Shopify Partner
302 90 114

This is an accepted solution.

Add this code in your base.css or theme.css:

 

.header__menu-item, .header__active-menu-item, .header__icon {
  color: white !important;
}

 

Replace 'white' with the color you want! (You can also use hexadecimal values, for example: #3B8B58)

 

1.PNG

 

View solution in original post

Replies 6 (6)

Spac-es
Shopify Partner
302 90 114

This is an accepted solution.

Add this code in your base.css or theme.css:

 

.header__menu-item, .header__active-menu-item, .header__icon {
  color: white !important;
}

 

Replace 'white' with the color you want! (You can also use hexadecimal values, for example: #3B8B58)

 

1.PNG

 

Cukrovinky
Tourist
22 0 2

Thanks for the solution. Can you also do code that removes the underline and color for hover and active page of the menu?

PageFly-Richard
Shopify Partner
4079 913 1567

Hi @Cukrovinky 

 

This is Richard from PageFly - Shopify Page Builder App

 

Please add this code to your theme.liquid above the </head> to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: click on theme.liquid and paste the code above the </head>

<style>
header a, header span, header svg {
    color: #fff !important;
}
</style>

PageFlyRichard_0-1706057366454.png

 

Hope this can help you solve the issue 

 

Best regards,

Richard | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

ZenoPageBuilder
Shopify Partner
1052 203 219

Hello @Cukrovinky 👋

In Shopify Admin, you can go to Edit theme code, open file base.css and add this code at the bottom

.header__menu-item,
.header__active-menu-item,
.header__icon svg {
    color: #FFFFFF !important;
}

The result

Screenshot 2024-01-24 at 09.19.15.png

Hope that helps.

Zeno Page Builder - Build responsive & SEO-optimized Landing pages, Blog posts, Product pages and more...
Learn more at zenobuilder.com

topnewyork
Trailblazer
215 25 27

Hi Cukrovinky,

In Shopify Admin, navigate to "Edit theme code", then open the "base.css" file and add the following code at the end:

 

 

.header__menu-item, .header__active-menu-item, .header__icon{ 
color: red; 
}

 

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Need a Shopify developer?
Hire us at topnewyorkwebdesign.com
For Shopify Design Changes | Shopify Custom Coding | Custom Modifications
Subscribe to our youtube channel

helen25
New Member
16 0 0

Hi cukrovinky,

 

Follow these steps :

1) Go to Online Store
2) Edit Code
3) Find base.css file

4) And put this code in the botom

 

 

.header__menu-item span {
  
    color: white;
}
.header__icon .icon {
    
    color: white;