Social Media Icon Colours - Acme Themes

Best Premium and Free WordPress Themes Forums SuperNewsPro Social Media Icon Colours

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #14198
    Connor Runstedler
    Participant

    Hello,
    Just wondering if it is possible to change the colours of the social media icons on the customization bar? Having troubles finding it.
    Thanks Connor

    #14199
    acmesupports
    Moderator

    Hello Connor,
    Thank you so much for your question regarding our theme. Please add the below CSS codes on Appearance > Customize > Additional CSS to change the color of the social media icons.

    .fa-facebook {
        color: #3C579E;
    }
    .fa-twitter {
        color: 1da1f2;
    }
    .fa-linekdin {
        color: 0077b5;
    }
    
    .fa-google-plus {
        color: dd4b39;
    }

    Let us know the results.

    Regards
    Acme Supports

    #14237
    Connor Runstedler
    Participant

    I was wondering if there is additional css for the background color when you hover the mouse over it or click on it. It is set to a default depending on the icon (youtube=red, facebook=blue, etc.) was wondering if this can be changed?

    #14243
    acmesupports
    Moderator

    Try the below css,

    .fa-facebook:hover {
        color: #3C579E;
    }
    .fa-twitter:hover {
        color: 1da1f2;
    }
    .fa-linekdin:hover {
        color: 0077b5;
    }
    
    .fa-google-plus:hover {
        color: dd4b39;
    }
    #14265
    Connor Runstedler
    Participant

    That CSS changes the colour of the icon itself, not the background colour that lies behind the icon when it is hovered over. If you check my website http://www.elonmuskdaily.com when you hover over any of the icons the background color will change. Was wondering if this could be changed?

    Thanks for your help
    Connor

    #14266
    Connor Runstedler
    Participant

    The icons im referring to are in the top right corner of the front page

    #14267
    acmesupports
    Moderator

    Please add the below CSS codes. If you need to change the color, you can changed based on your need.

    .socials a.facebook:hover{
     background-color: #3C579E;;
    }
    .socials a.twitter:hover{
     background-color: #01BBF6;;
    }
    .socials a.linkedin:hover{
     background-color: #1484C3;;
    }
    .socials a.instagram:hover{
     background-color: #2D6A93;;
    }
    .socials a.youtube:hover{
     background-color: #D62424;;
    }
    .socials a.google-plus:hover{
     background-color: #D73D32;;
    }
    .socials a.pinterest:hover{
     background-color: #BD2126;;
    }
    .socials a.flickr:hover{
     background-color: #FD0083;;
    }
    .socials a.tumblr:hover{
     background-color: #34465D;;
    }
    .socials a.vk:hover{
     background-color: #45668e;;
    }

    Regards

Viewing 7 posts - 1 through 7 (of 7 total)
  • The topic ‘Social Media Icon Colours’ is closed to new replies.