FontAwesome icons doesn't work in css content

Question

I am entering the following code:

a::before {
    content: "\f061";
    font-family: FontAwesome;
} 

But font-awesome icon doesn't show up, just an empty square.

What is the problem?

Thank you!

Answer 1

TRY THIS, it works for me :)

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css">
or
@import url("https://use.fontawesome.com/releases/v5.2.0/css/all.css");

a::before {
   content: "\f061";
   font-family: "Font Awesome 5 Free";
   font-style: normal;
   font-weight: 900;
   text-decoration: inherit;
} 

Answer 2

This answer from @TemaniAfif may be helpful.

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css">
@import url("https://use.fontawesome.com/releases/v5.2.0/css/all.css");

.fp-prev:before {
    color:#000;
    content: '\f35a'; /* You should use \ and not /*/
    font-family: "Font Awesome 5 Free"; /* This is the correct font-family*/
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
}