In your Child Theme or CSS Editor Plugin try this code:
.fa-search {
color: #009900 !important;
}
Just edit the green color I used
*Note
If your theme has a custom CSS Editor in it, you can also paste the code in there.
Never edit core CSS or PHP files under Appearance > Editor. Your edits will be deleted when the theme is updated.
Hi Joanna,
The following can be used for the search icon’s color:
.site-header .search-form-container button i {
color: #43b3c4;
}
And this will change the color of the button’s background:
.site-header .search-form-container input.search-submit {
background: #43b3c4;
}
Please let me know if I missed an element, or if you have any other questions.
Ben,
that aaaalmost does the trick 😉 there’s the icon background left – seems like it’s separate from the other social icons background.
Ok, I found your answer in another thread. So, fo future reference, this is the whole code for changing all search form elements colors.
.site-header .search-form-container button i {
color: #ff48a9;
}
.site-header .search-form-container input.search-submit {
background: #BA137B;
}
.site-header .search-form-container button {
background: #210316;
}
Awesome thanks for sharing that Joanna!
