Create Font With Icons

Create font with icons

We are using Fontello to generate the font from svg icons.

1. We need to create a new project. If we already have that project loaded, upload existing icons on Select icons tab, inside Custom Icons title.</br></br>

2. Because we are going to update an already created font, we should import the config.json file, and we can do that from the tool button, and choosing Import menu item.</br></br>

3. config.json file is in GoodDAPP project, inside src/components/common/view/Icon folder.

4. The way to upload a new icon is doing Drag & drop over Custom Icons box.

5. After that we select the icons we want to add to the font. As the previous image shows, selected icons has a red border, and we selected all of them.

6. In the second tab called Customize Name we can change icon names. It is configured for all icons to have icon- prefix, so we can change the name after the prefix.</br></br>

7. Once we renamed the icons, we can see the codes, and we can update some of them if it's necessary...in most of the cases we can leave the code as they are. We can do this in the third tab called Customize Codes.</br></br>

8. Before downloading the font, we can define the name, and the default font size at the top bar. In this case we named it gooddollar.</br></br>

We can also add icons from other fonts that are available on the main page of Fontello just selecting icons from there on the first tab.