How do I find the Unicode value for a FontAwesome icon?

Question

I'm wanting to be able to do something like this:

 button.accordion:after {
    font-family: FontAwesome;
    content: "\f150";
    font-family: "fontawesome";
    font-size: 18px;
    float: right;
  }

But I'm not sure how to find the unicode value.

There are some similar questions on here, but they are super convoluted. I'm just wondering if there is a practical way to find the Unicode value of an icon without Javascript to add into my CSS.

Answer 1

When you go to the font-awesome website, you see the search option. You can find your icon, and as shown in the screenshot you can get the Unicode for any icon.

If you want to add an icon's Unicode in a CSS file, first you have to download the icon on your PC and in all.min.css you will find the .ttf file. You have to replace their file path with your path. And then you can use icons on your website.

Answer 2

I figured it out.

First of all, you need to add the icon in the HTML or Js Framework so that it is displayed in the DOM.

Next, you need to select the icon using Developer Tools. Once you have selected it, look at the filter styles in the CSS section of the Developer Tools console.

Find "Pseudo elements" and you'll see the Unicode for the icon that matches the name of the selected icon.

Copy that Unicode sequence and you'll be good to go.