How can I edit Font Awesome (or include my own icons)?

svg fonts font-awesome
André Staltz picture André Staltz · Jul 30, 2013 · Viewed 60.3k times · Source

Font Awesome is fully open source, so how can I tweak some icons as I wish, or add new icons? Let's say my primary vector tool is Inkscape (open source GPL).

The fontawesome package comes with files *.eot, *.otf, *.svg, *.ttf, and *.woff. The svg file does not successfully open in Inkscape. What program(s) can be used to edit these?

And once I edit the fonts, what guidelines should I follow? What unicode characters slots should I use? What should I be aware of when editing LESS source code to include new icons?

I'm not necessarily interested in submitting new icons to the official repo, I just want to fork and mutate it a bit, rather than having a couple of my own icons loaded ad-hoc.

Answer

methodofaction picture methodofaction · Jul 30, 2013

You can use icomoon. Browse to the library page and use FontAwesome, you can augment FontAwesome's libary with your custom icons in SVG.

Related questions

Transparent text cut out of background

Is there any way to make a transparent text cut out of a background effect like the one in the following image, with CSS? It would be sad to lose all precious SEO because of images replacing text. I first …

Read More
Google webfonts render choppy in Chrome on Windows

I use the Google Webfonts service on my website and rely heavily on it. It renders fine on most browsers, but in Chrome on Windows it renders especially bad. Very choppy and pixelated. What i have found out so far …

Read More
Creating icon fonts with vector software (i.e. inkscape) and fontforge?

Through getting some answers here and some research, I've come across a new approach to implementing icons. Rather than as images or css background, it seems you can approach icons as a font. Will this method ultimately mean creating a …

Read More