StyledThemes

How to change the colour of Font Awesome icons?

Home Forums WordPress Themes – Premium Pure & Simple How to change the colour of Font Awesome icons?

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #16989
    Donna Green
    Participant

    Hi there, please can someone help me change the colour of the Font Awesome icons which I am using in widgets?

    I’ve managed to write some CSS which alters the colour of the outer circle (see attached picture), by adding in this custom CSS:

    
    
    .icon-circle.red i {
    	border-color: #82150f;
    	color:#666666;
    }

    However, I just can’t figure out how on earth to change the colour of the icon itself and would really appreciate advice.

    The code I used in my widget is this:

    
    
    [fa type="camera-retro" ]

    read FAQs

    Find out more - your questions answered

    Many thanks for any help!
    fontCircle.jpg

    Attachments:
    You must be logged in to view attached files.
    #22380
    Sushil Adhikari
    Moderator

    Hi there,

    Here is the solution of your issue:
    1> Here we had added xclass arguments and provided a class named ” change-font-awesome-icons”

    [fa type=”camera-retro” xclass=”change-font-awesome-icons” ]

    read FAQs

    Find out more – your questions answered

    And finally i add this css on child theme style.css file

    i.fa.change-font-awesome-icons {
    color:red;
    }

    Please let us know how it will goes.

    Note: Please use child theme style.css file to add custom css, so your changes will not lost on theme update.

    Thanks

    #22381
    Donna Green
    Participant

    Thank you very much indeed – this works perfectly!

    #16990
    Sushil Adhikari
    Moderator

    That’s awesome Donna Green 🙂

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.