Skip to content
briangonzalez edited this page Aug 9, 2012 · 2 revisions

In order to add new glyphs you need a font editing application. Glyphs for OS X is by far the cheapest solution.

Illustrating new glyphs and adding them to the font

In this repo, there is a files called genicons.glyphs.

You can compose new vector icons in Adobe Illustrator, create a new cell in Glyphs by clicking the little + in the lower left-hand corner of the app.

Double-click on the newly inserted (but blank) glyphs and copy/paste your vector from AI into Glyphs app. Scale the icon to fit the canvas.

Important: make sure the unicode code falls within the private use unicode range (U+E000..U+F8FF). Also, be sure to group icons by category.

Generating woff, eot, and svg files

Once you're done adding your new icons to genicons, export the font as an .otf file, an save it somewhere.

Go to Font Squirrel's @font-face generator, which will allow you to convert otf or ttf files to woff, eot, and svg files -- which are all needed for x-browser compatibility.

fontsquirrel.png

Adding a reference to the new icon on the Github-page (gh-page)

One can see all current icons here. Each time a new character is added, you must recompile the github page.

On the gh-pages branch of this repo, there is a [icon.yml](https://github.com/geni/genicons/blob/gh-pages/_jekyll_site/icons.yml) file. Following the conventions in that file, add your icons character code plus a description.

Next, recompile the Github pages site. You can find out how to do that here.