Change the Search Icon Color?

[weebly4mayor]

enochpacheco.com

I need the search Icon, located on the top right corner, to be the color: #fff

[weebly4mayor]

I'm pretty sure this is the line I need to change?

[PaulMathews · Accepted solution]

@weebly4mayor You've identified the correct block of css. You just need to add a filter attribute to the search icon image (below, I've made the filter change the search icon image color to black and then the image color is fully inverted to white):

.wsite-search-button {
display: inline-block;
width: 20px;
height: 20px;
background: transparent url(theme/images/light-search.png?1620100864) no-repeat center center;
background-size: contain;
filter: brightness(0) invert(1);
color: #fff;
}

[weebly4mayor]

Thank you for that @PaulMathews

[weebly4mayor]

@PaulMathews

[weebly4mayor]

@NJRFTF

[weebly4mayor]

@whitemonkey

[weebly4mayor]

@Adam

[crazyninja]

You've identified the correct block of css. You just need to add a filter attribute to the search icon image (below, I've made the filter change the search icon image color to black and then the image color is fully inverted to white):

.wsite-search-button { display: inline-block; width: 20px; height: 20px; background: transparent url(theme/images/light-search.png?1620100864) no-repeat center center; background-size: contain; filter: brightness(0) invert(1); color: #fff; }