How to make the filter button text a different color

[Viibed]

I am designing my products page and noticed that my filter text color button is black while everything else is white.

How do I change this to white without changing the theme colors?

Here is my website: Products – Viibed 

Thank you!

[vinh0225]

Hi @Viibed 

I can help you. Do you want this result?

[Viibed]

Yes, but with the filter icon being white too.

[vinh0225]

Please try to add this code in layout/theme.liquid file.

<style>
.mobile-facets__disclosure .mobile-facets__open-wrapper .mobile-facets__open .icon-filter {
	color: white;
}

.mobile-facets__disclosure .mobile-facets__open-wrapper .mobile-facets__open .mobile-facets__open-label {
	color: white;
}
</style>

[Viibed]

I put in the code, but it did not change anything.

[vinh0225]

If you correctly added the code in the layout/theme.liquid, we should see it in the website source code.

However, I can't find it added yet.

If you want me to work on your theme, please provide me with the collaborator access.

[ZestardTech]

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the bottom of the file:

.mobile-facets__open {
color: white;
}
.mobile-facets__open:hover {
color: white;
}

[GTLOfficial · Accepted solution]

Hello @Viibed 
Go to online store ---------> themes --------------> actions ------> edit code------->assets ---> component-facets.css

.mobile-facets__open {
color: rgba(94, 238, 14, 0.85) !important;
}
.mobile-facets__open:hover {
color: white !important;
}

and the result will be

on hover this will display color white.

If this was helpful, hit the like button and mark the job as completed.
Thanks