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

Font Awesome 5 uses svg for icons and path inside are set with fill:currentColor so simply change color of svg:

.icons svg {
 color:#2759AE;
}

  

    

      
      
LOREM
      
Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui.
    
  
  

    

      
      
LOREM
      
Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui.
      
    
  

As you can see in the code, the i are replaced with svg when you load the JS version:

---

You can apply color to i in case you are using the CSS version.

.icons i {
 color:#2759AE;
}

  

    

      
      
LOREM
      
Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui.
    
  
  

    

      
      
LOREM
      
Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui.
      
    
  

So to make sure it will work in all the cases simply use both selector:

.icons i,
.icons svg {
   color: #2759AE;
}