Black Friday Sale! Get up to $30 off GP Premium! Learn more ➝

[Resolved] How to change Font Awesome icon colors?

Home Forums Support [Resolved] How to change Font Awesome icon colors?

Home Forums Support How to change Font Awesome icon colors?

  • This topic has 3 replies, 4 voices, and was last updated 3 years ago by Richard.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #206313
    Ignacio

    Hello Tom:
    I want to change the color of the default black Font Awesome icons, for example into blue. How can I do that?
    Thanks in advance

    #206353
    Tom
    Lead Developer
    Lead Developer

    Add the color to the HTML element, like this:

    <i class="fa fa-car" style="color:#DDDDDD;"><!-- icon --></i>

    Let me know if that helps or not 🙂

    #206567
    Max

    You can also add icon sizing

    <i class="fa fa-car fa-lg" style="color:#DDDDDD;"><!-- icon --></i>

    <i class="fa fa-car fa-4x" style="color:#DDDDDD;"><!-- icon --></i>

    See here:
    http://fontawesome.io/examples/

    • This reply was modified 5 years, 5 months ago by Tom.
    #722537
    Richard

    And there is also css so you can make site-wide changes e.g.:

    .fa {
    	color: black;
    }
    .fa-car {
    	color: red;
    }
    .fa-bus {
    	color: green;
    }
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.