Font Awesome & Unicode

Question

I\'m using (the excellent) Font-Awesome in my site, and it\'s working fine, if I use it this way:

B

Answer 1

You must use the fa class:

<i class="fa">
   &#xf000;
</i>

<i class="fa fa-2x">
   &#xf000;
</i>

Answer 2

There are three different font families that I know of that you can choose from and each has its own weight element that needs to be applied:

First

font-family: 'Font Awesome 5 Brands'; content: "\f373";

Second

font-family: 'Font Awesome 5 Free'; content: "\f061"; font-weight: 900;

Third

font-family: 'Font Awesome 5 Pro';

Reference here - https://fontawesome.com/how-to-use/on-the-web/advanced/css-pseudo-elements

Hope this helps.

Answer 3

For those who may stumble across this post, you need to set

font-family: FontAwesome; 

as a property in your CSS selector and then unicode will work fine in CSS

Answer 4

Bear in mind that you may need to include a version number too as you could be using either:

font-family: 'Font Awesome 5 Pro';

or

font-family: 'Font Awesome 5 Free';

Answer 5

By using css you can add your icon via Unicode

content: '\f144';
font-family: FontAwesome;

This will work

Answer 6

I found that this worked

content: "\f2d7" !important;
font-family: FontAwesome !important;

It didn't seem to work without the !important for me.

Here's a tutorial on how to change social icons with Unicodes https://www.youtube.com/watch?v=-jgDs2agkE0&feature=youtu.be