36

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.

2

4 Answers 4

48

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

0
10

As well as the solution mentioned (which is perfect), you can also subset and combine icon fonts using:

  • icnfnt (officially supported subsetting of font-awesome icons - original .com now a dead link, but the github repo is still available)
  • fontello.com (create a custom subset from a number of icon fonts that are widely available)
2
  • 4
    icnfnt.com seems to be a broken link.
    – Flimm
    May 17, 2016 at 8:53
  • @Flimm, not broken but entirely dead... Re-directed to the git repo if anyone interested in digging up the bones and picking over them.
    – nickhar
    Jul 16, 2018 at 23:08
9

If you want access to the raw svg and .png files, there is a git repo for that: Font-Awesome-SVG-PNG

2

If you want some icons (or all) from font-awesome including yout custom svg icons you can:

1- Go to http://fontawesome.io/ Download the zip and extract-it for example in your Desktop.

2- Go to http://fontastic.me/ use your email to create an account.

  1. Once you have been logged-in click on the header option: Add More Icons.

  2. Select the SVG of font-awesome located in your extracted zip inside fonts.

  3. Repeat the procces uploading your own svg files.

  4. Inside Home (at the header of the page) Select the icons you want to download, customize them to give your custom names and select publish to have a link or download the fonts and css.

Sorry about my english ! :D

Your Answer

Reminder: Answers generated by Artificial Intelligence tools are not allowed on Stack Overflow. Learn more

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.