A lot of computer savvy have been using font awesome icon for quite a while now. As a matter of fact, some have already made a couple of tweaking on it and designed it for their specific projects. The problem with font awesome data is that it is significantly heavy. It offers dozen of cons, which a lot of people do not actually use. Even if it is partly good that it provides a lot of options, most of the time, we would prefer settling for those icons we often use or chose to have. For this reason, some computer geeks could only wish to create their own font awesome icons. If you are among these folks, this is the moment you have long been waiting for. In this article, you will learn how to create your own font awesome icon.
Here are some of the basics you should keep in mind for a truly awesome font awesome icon:
Font-What-Now?
Before anything else, you should know that the characters/symbols in the font serve as your icons. You will be able to apply these characters using CSS. These characters can be scaled upon modification of size and zoom view. With the availability of retina displays on different devices, font awesome icons are among the most preferable utilities for your web applications. If there is any downside that such icons may have is that there is only a single color because they are font – though you can have some modifications via CSS3.
Creating Your Preferred Icon Set
There can be several ways on how you can come up with your on font awesome icons. One of which is by mean of Font Custom. This is one of the tools used to transform SVG images to turn into your preferred Font Awesome-esque set of font icons. The process requires several packages in order to make the installation from apt-get or brew (limited to Linux and Mac as of the moment) as well as a gem that will be used to watch the directory and create the font.
When the installation is done, you may then setup a watch-directory setting for SVG images and then recompile any changes noted by the font. Alternatively, you may also run it all at one to create the font based on the directory provided. The result of this will be a collection of files which includes a couple of icon versions designed for multi-browser compatibility. It will also have the CSS with the groupings reflecting every icon label in your images directory.
Once you already set the Font Custom create icon, you are close to finishing the whole task. Do not forget to include the font files and the CSS in the project and add the icon group you prefer into a DOM element. Thats it. You now have your own font awesome icon set especially designed to meet your needs and preferences. Now, you will really have the most convenient time with your website.