To achieve this, the icon font generator takes the grid size of each icon into account, and uses a proper alignment.

We proudly claim that IcoMoon is the only online service that generates crisp, pixel perfect icon fonts. IcoMoon is constantly improving and it offers many unique features. IcoMoon introduced the first custom icon font builder, which allowed selecting icons and converting them to fonts. Since its release, it has changed the way icons are being used in web today. IcoMoon was first built and released back in the November of 2011. The IcoMoon app lets you build and use your own icon packs in many different formats including SVG, Polymer, PDF, XAML, CSH, icon font with All of our icons are designed on a precise pixel grid. IcoMoon's icon library features only the very best icon sets out there. For example, let’s say we have a circle but we only want to show half of it, we can create a full circle in the SVG and set the viewBox to cut through the circle.IcoMoon is striving to build and provide the best iconography and icon management tool for perfectionists. The viewBox attribute represents the viewable area of the graphic. ViewBox - this is more complicated to get your head around, but simply represents the viewable area of the SVG canvas (what?! - all will be explained) 2. These can be used to scale the vector to fit certain dimensions. Width/height - self-explanatory, the total width and height of the SVG element. On this element, we can add some basic parameters which help set up the SVG. SVG’s are similar to HTML elements, instead of defining DOM layout, they define paths and shapes.Įach defined set of instructions for our SVG sit inside tags. But, it should provide a good starting point for coding simple icons. It’s by no means a comprehensive introduction to SVG’s. The following article demonstrates how to create some simple SVG icons. SVG’s can seem daunting, especially if you see the exported code from a vector editor.

A simple bit of SVG code can do the trick.

But, if you only need one or two it can feel like overkill. And yes, there are great libraries such as Glypicons and Fontawesome to help out. As a developer, I often come up against situations where I need an icon.

Icon svg user