How to Add Color to Social Sharing Icons?

[IlluminateLabs]

I added social sharing icons to our store, both on blog pages and on product pages.

The icons default to black, which looks bad. I want each icon to have its standard color (Facebook blue, Pinterest red, Twitter light blue). 

I know how to change the color of all three icons with CSS, but I don't know how to just make each icon its standard color since I don't know where Shopify is pulling the icons from.

Any insight would be much appreciated!

[Guleria · Accepted solution]

Hello,
You can change color of each with same rule as you did for all, I mean using element class or id.

span.icon.icon-pinterest {
    color: blue;
}
span.icon.icon-twitter {
    color: green;
}
span.icon.icon-facebook {
    color: red;
}

Note: Change color code a/to your need.

[IlluminateLabs]

Ah, perfect thank you! 

To anyone else reading this with the same issue, I kept red and blue for Pinterest and Facebook respectively, added a custom HEX color for the light blue Twitter, and put the CSS under the social sharing section of the CSS file rather than at the bottom, so it only affected the social sharing icons and not the other social media icons on our site.

[offbeatcookie]

Hello there, Can you exactly share where I need to adapt these lines?
Thank you very much in advance