Solution Timeline

All versions (edits) of solutions to SASS variables for GitHub pages site powered by Jekyll not updating to reflect color changes appear below in the order they were created. Comments that appear under revisions were those created when that particular revision was current.

To see the revision history of a single solution (with diffs), click on the solution number (ie. "#1") in the upper right corner of a solution revision below.

← Bounty Expand all edits

In CSS style sheet add the below code to get red meetup icon


Similarly you can fill/change any fa icon color by:

fa-<icon_name_here>{ color: name_of_the_color; }

Hi There,

i will propose all solutions for that:

1/ using Social Buttons for Bootstrap:


this plugin, is powerful, and gives you nice buttons code, simply to integrate in your website.

2/ using Font Awesome Colored - Brand And Social Icons:


this plugin, is written in CSS code also, defining the real colors of each icon, with nice effects, if you want them supported. if you want a transparent background, just refactor the code and change background-color by color (only for icon colors), and you will have the same like in your website, with nice transition effects.

3/ using Social Media Colors – Hex and RGB Colors of the Web:

link 1:

link 2:

these links, have the real hex and RGB colors for the SASS icons, you can get use of them

Recommended Solution:

Personally, i suggest using the second solution, since it have many chapes and nice CSS transition effects. and don't forget to change background-color by color if needed

all you want is here, get nice use of it.

hope you liked my solution.

you should try some adding extra properties or over writting in your scss or css. like this one (.fa.fa-fw.fa-envelope-square{ color: red })
adding the color what ever you want .. i try and it work for me i hope it will useful for you. And by the way why you don't make an extra css link file which over write the properties of scss or font awesome properties.