8 Great Icon Font Generators to Give Your Site a Custom Feel
High-quality images can make the difference between a good website and a great website. However, they also add file weight, aren't easily scaled, edited or manipulated, and result in additional HTTP requests.When it comes to responsive design, the best solution is often not to use an image at all, and instead use icon fonts when appropriate. They're easily customized, allow for transparency and have good browser support. And because they contain fewer characters than a complete typeface, they also take up less memory.
Creating icon fonts doesn't have to be time-consuming, because there are several generators that let you build your own custom font — using only the icons you really need — to help reduce file size. These also provide a download package with font and CSS files, ready to integrate straight into your website.Using an icon font can improve load times by up to 14%, and because they're vector in nature, they're infinitely scalable, while still being smaller in size than an image sprite. You can style icon fonts dynamically using CSS, rather than requiring a new graphic, with the added bonus of using CSS3 properties such as "text-shadow."The process for using icon fonts is the same as loading any other font — by using the "@font-face" method, you can create the CSS rules that apply to each icon, create specific icon classes and finally add some simple HTML markup. Or, you can take an alternate approach and use the "data-icon" attribute in combination with CSS attribute selectors.
1. Icon Vault
Icon Vault lets you create icon fonts using only the icons you need, meaning less HTTP requests and faster page loading times. The fonts are vector graphics that will scale gracefully and look great on all devices, including those with Retina displays.
You can apply CSS styling, including color, text shadows, vertical alignment, animation and font size. It's easy to get started creating your own -- just download the template and upload a folder of your own icons for Icon Vault to make them into a custom font, using a simple drag-and-drop interface.