Menu icon Foundation

Badgestatus awarded
Eric Echeverri over 4 years ago

Is is possible to add additional custom svg icons to the foundation font lib. if not what would be the best way to add additional icons in Foundation

Rafi Benkual over 4 years ago

That looks cool. Was there a message you wanted to include?

Rafi Benkual over 4 years ago

Ok, yes! You can submit a PR here:

Let me know if you need any help.

Eric Echeverri about 4 years ago

I have a set of icons we are using in our app. Would you please indicate the procedure to push them there.

Or if you would like me to pick and choose, then I will


Rafi Benkual about 4 years ago

Cool! I'll share these with our design lead to see if we can add them in! I'll get back to you soon!

Eric Echeverri about 4 years ago

Also I have a question how would I make the foundation fi-star a round icon in blue. I am trying to use your icons as much as I can

Rafi Benkual about 4 years ago
Eric Echeverri about 4 years ago

The last one was very helpful. Thank you so much

Saul about 4 years ago

Yes, you can.

First make the design you want to include in SVG format.
Copy an paste/rename any file in the SVG folder.
Open it and clears the current design, then insert your own design, trying to fit within the margins of the previous design, save.
Download and install FontForge
Open any font file, click on the empty box back to the last entry, look for the Unicode number.
Import your design, then export the font in SVG, WOFF and TTF formats.
For the EOT format you can use a converter on the internet or use ttf2eot in Linux
In foundation-icons.css add a new line whit the class name and the unicode number of your design

That's all. Work for me.