We’re going to be using these files to “extract” the icons and convert them to SVG. The font file formats generated by Fontello. The font files are available inside a font folder. The files generated by Fontello.Īmong the generated files is the actual font used to define the icons. I picked a few icons and then generated an icon font and downloaded it.įontello generates a folder containing a demo page showing you how to display the icons on your own page and what class names to use. I don’t usually use icon fonts, so for the sake of demonstration, I headed to -an online icon font generator-to create an icon font that I can work with for this blog post. They’re part of a web font and are thus defined in web font files and formats. Grab your icon fonts files.įont icons are font glyphs. I’ve listed some articles at the end of this post for further reading. Many companies and organizations including Github have already made the switch to SVG, and have written great articles explaining why they found SVG to be a better alternative. If you’re not already convinced as to why SVG is a better icon system, then I highly recommend reading this article-a cagematch-style comparison between icon fonts and inline SVG for icon systems. Either way, this post is here to help you with that. Or maybe you're pondering the idea and want to get an overview of how that would be done and whether or not it's worth it. If you’re reading this article, then I can probably assume you’ve already decided to switch from using fonts for icons to an SVG icon system.
0 Comments
Leave a Reply. |