I have to wrap my icon within an <a>
tag for some reason.
Is there any possible way to change the color of a font-awesome icon to black?
or is it impossible as long as it wrapped within an <a>
tag? Font awesome is supposed to be font not image, right?
<a href="/users/edit"><i class="icon-cog"></i> Edit profile</a>
To change the color of an icon, select the icon you'd like to edit. The Format tab will appear. Then click Graphics Fill and select a color from the drop-down menu. To add an outline to your icon, click Shape Outline and select a color from the drop-down menu.
Font Awesome icons can be customized even further using your own CSS.
Go to Format > Font > Font. + D to open the Font dialog box. Select the arrow next to Font color, and then choose a color.
This worked for me:
.icon-cog {
color: black;
}
For versions of Font Awesome above 4.7.0, it looks this:
.fa-cog {
color: black;
}
HTML:
<i class="icon-cog blackiconcolor">
css :
.blackiconcolor {color:black;}
you can also add extra class to the button icon...
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With