How to change color of icons in Font Awesome 5?

Question

I can\'t colorize the Font Awesome 5 icons using these codes. I tried fill css property for setting color but it didn\'t work.

HTML Code:

Answer 1

If you're using the svg-with-js version of Font Awesome 5 it takes everything in the and preprocesses it into an . It specifies that the path has fill="currentColor" So, you have to set currentColor to the colour you want somehow. One option is:

svg {color: blue;}

The official docs recommend inline style:

Or, set currentColor in one of the outer elements. For example:

And to move it to the CSS file, you could:

div .bggray2 {
    color: blue;
}