Sign in
We're evolving to serve you better! This current forum has transitioned to read-only mode. For new discussions, support, and engagement, we've moved to GitHub Discussions.

How to change the color of the magnifying glass (search icon)

  • This topic has 4 replies, 3 voices, and was last updated 4 years ago by .
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #1548
    Avatar photo[anonymous]

    Hey there!

    I recently created a static blog. Really proud of, it’s like my baby: iambr.uno

    The thing is I have no idea how to change the color from white of the Search icon. (Check image attached).

    Any idea? I got the Simple theme.

     

    Cheers

     

    #1552
    Avatar photoBob

    Adding the following code should help:

    .search__btn > svg {
       fill: #000;
    }

     

    --
    Do you appreciate the support you've received today? If so, consider donating to the Publii team by clicking here; we'll be sure to use your donation to make Publii even better!

    #1553
    Avatar photo[anonymous]

    Thank you very much Bob but… ¿where should I include that? ¿On the <head> custom HTML?

    Let me ask you one more question:

    ¿How can I change the background color? I tried changing all the available colors and none worked. I wanted to make the background black.

     

    Thank you in advance,

    #1554
    Avatar photoBob

    Just use the Custom CSS tool.

    Our support doesn’t include custom development or customization. If you need some extra features or elements in our themes, feel free to contact us via https://getpublii.com/customization-service/ page.

    --
    Do you appreciate the support you've received today? If so, consider donating to the Publii team by clicking here; we'll be sure to use your donation to make Publii even better!

    #1563
    Avatar photoitips3727
    iambruno wrote:

    Thank you very much Bob but… ¿where should I include that? ¿On the <head> custom HTML?

    Let me ask you one more question:

    ¿How can I change the background color? I tried changing all the available colors and none worked. I wanted to make the background black.

    Thank you in advance,

    If you want to also cover hover and focus, you could also add in the Custom CSS Tool:

    `.search__btn:focus > svg, .search__btn:hover > svg {fill:rgba(0, 0, 0, .7)}`

     

Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘How to change the color of the magnifying glass (search icon)’ is closed to new replies.