DEV Community

Add custom icons to Font Awesome

Andrea Stagi on November 17, 2020

In one of my recent projects I used Font Awesome as icon set but I needed to add a new icon not included in the standard Font Awesome's library, th...
Collapse
 
iain_munro_a6fce1b5994096 profile image
Iain Munro

I was hoping that this would be a good article, but it lacks one thing and it is critical, is how do you now make it work. How do you connect the files we just made ?

80% of the work done - what was the point ?

Collapse
 
astagi profile image
Andrea Stagi

Hi Iain, have you tried the example attached? c63px.csb.app/

Collapse
 
ssandison profile image
ssandison

I think he's asking how do you build the custom font awesome library to replace the standard font awesome library.

Collapse
 
mnemosdev_52 profile image
mnemos

Nice article!

Collapse
 
astagi profile image
Andrea Stagi

Thanks!

Collapse
 
kaushik94 profile image
Kaushik Varanasi

This helped me in my project. Thanks for sharing.

Collapse
 
ffex profile image
ffex

Nice and useful article! I want to use it in an angular project, it is possible? I don't know how to reference the ts in the project.

Collapse
 
nerdess profile image
Sissi Adamski

nice tutorial, just on thing is a bit unclear to me. what is the purpose of "the unicode point which represents this custom icon (e001)" - thx!

Collapse
 
astagi profile image
Andrea Stagi

Hi Sissi, it represents the Unicode value for the icon and e001 is a higher number than the highest Unicode used in FontAwesome. If you have more than one icon and Unicode value is relevant for you, then you have to assign a different Unicode value for each icon (e001, e002 ...).

Collapse
 
lsrael22t profile image
Israel Robles

This is a very useful article, thanks.

Collapse
 
astagi profile image
Andrea Stagi

Thank you 😊