background preloader

Free Icon Fonts for Web User Interfaces

By Jacob Gube This roundup features 18 free icon fonts that can be used in your commercial projects. The icon fonts in this post are perfect for your app user interfaces (UIs). What are Icon Fonts? Icon fonts are font files that have symbols and glyphs (e.g. arrows, folders, magnifying glasses) instead of standard alphanumeric characters. Icon fonts are like dingbat fonts, but are designed specifically for UIs. And because they’re treated like web fonts, icon fonts: Have great cross-browser support (even IE6, for example, can render web fonts using the @font-face rule)Can be scaled on-the-fly if the user adjusts their web browser settingsCan be rendered with different colorsCan embody font- and text-related CSS properties (like text-shadow and gradient) See icon fonts in action by visiting my friend Chris Coyier’s icon fonts demo page. To learn how to use icon fonts, read this tutorial on CSS-Tricks: HTML for Icon Font Usage. Free Icon Fonts 1. Number of icons: 137. 2. Number of icons: 121. 3.

Freebie: Extended Entypo Glyph Set (EPS, PDF, PSD, Typeface, Web Font) Advertisement After endless suplications from the design community Daniel Bruce finally finished his update of the Entypo Glyph Set1 — a free set of universal 284 carefully crafted pictograms for regular design projects. The icons are available as EPS, PDF and Photoshop PSD files as well as desktop typefaces (TrueType, OpenType) and Web fonts. Download The Set For Free! This set contains a large collection of glyphs for all occasions and uses — common pictograms that shouldn’t be missing in anybody’s arsenal. The freebie is licensed under the Creative Commons Attribution-ShareAlike 3.0 Unported license2. Behind The Design As always, here are some insights from the designer: “The first Version was released in February 2012 and had around 120 glyphs. Thanks, Daniel! (jc) It's done.

100 Free Fonts: Grab and Use | Freebies Monday is a cool reason to start your work week. So let's start this day with something good and positive. Today I want to share with you a cool set of useful but still free stuff. What I'm talking about? A huge collection of free fonts is here! Scroll down to find some free fonts for your own usage, to find some inspiration and motivation. Grab and use these amazing free fonts! Stroke Mr. Nougatine Catenary Skinny Marker Block font Kioshima Multicolore KanKin Metropolis Intro The Kabel Veneer Extras Sofia Pro Verb Lolita Tikal Sans Zantroke Noticia Text Tolstoiska Babalu Festiva Orbits Silverfake Mosaic Leaf Brutalized Elo Slinkster RBNo2.1 Doux Ballege Deathray Sreda Color Basic Labrat Xanaxb Textan Navajo Alchemeo Vhia Bree Serif Jockey Knewave League Gothic Blackout Ostrich Sans Open Sans Font Neou Font Reklame Script Tetra

The Making of Octicons 4 Tools to Pick Your Chart Colors I used to manually select my color schemes with trial and error, but these days, there are a lot of tools to help you pick colors for your charts. The motivation for most of them is to help you visualize your data in a way that is perceptually correct. That is, perceived differences translated between your eyeballs and your brain match the actual quantitative differences. While there are new tools released fairly often, I tend to stick to these four simple and quick ones. Here they are by purpose. When you’re in a rush but need something better than defaults ColorBrewer is the old standby. ColorBrewer color schemes are also baked into a lot many packages and tools, like d3.js and R. When you have more time to browse The Colorpicker for Data tool by Tristen Brown is straightforward and kind of fun to play with. It’s as quick to use as ColorBrewer, but you might catch yourself finicking more than you wanted with the endless color choices. When you need new color ideas

Freebie: Gemicon Icon Set (600 PNG Icons + PSD Source) On snot and fonts Africa: ⦿ Africa ⦿ Berber ⦿ Coptic ⦿ Egypt ⦿ Hieroglyphics ⦿ Mauritius ⦿ Morocco ⦿ Other ⦿ South-Africa ⦿ Tunisia Oceania: ⦿ Australia ⦿ Maori ⦿ New Caledonia ⦿ New Zealand ⦿ Rongo Rongo Europe + the old USSR: ⦿ Albania ⦿ Austria ⦿ Basque ⦿ Belarus ⦿ Belgium ⦿ Bosnia ⦿ Bulgaria ⦿ Catalunya ⦿ Celtic/Gaelic ⦿ Croatia ⦿ Cyprus ⦿ Cyrillic ⦿ Czechia ⦿ Denmark ⦿ Eastern European ⦿ Esperanto ⦿ Estonia ⦿ Finland ⦿ France ⦿ Georgian ⦿ Germany ⦿ Greece ⦿ Greek ⦿ Hungary ⦿ Iceland ⦿ Ireland ⦿ Italy ⦿ Kazakhstan ⦿ Kosovo ⦿ Kyrgyzstan ⦿ Latvia ⦿ Liechtenstein ⦿ Lithuania ⦿ Luxemburg ⦿ Macedonia ⦿ Malta ⦿ Moldova ⦿ Montenegro ⦿ The Netherlands ⦿ Northern Ireland ⦿ Norway ⦿ Ogham ⦿ Old Italic ⦿ Poland ⦿ Portugal ⦿ Romania ⦿ Russia ⦿ Scotland ⦿ Serbia ⦿ Slovakia ⦿ Slovenia ⦿ Spain ⦿ Sweden ⦿ Switzerland ⦿ Turkey ⦿ United Kingdom ⦿ Ukraine ⦿ Uzbekistan ⦿ Wales Far East: ⦿ China ⦿ Hong-Kong ⦿ Japan ⦿ Korean/Hangul/Chosongul ⦿ Macao ⦿ Mongolia ⦿ North Korea ⦿ South Korea ⦿ Taiwan

7 Gorgeous Icon Fonts for Web Designers TNW first covered the growing popularity of icon fonts back in January, and since then the Web has practically exploded with impressive icon fonts for use in Web design. For those that are out of the loop, you can think of an icon font as a grown-up version of dingbats…with an actual use-case. The core idea is to take a set of icons or pictograms that would normally be implemented as an image or vector file and then convert it into a font. There are many reasons to do this too, according to Pictonic, as an icon font can load as much as 14% faster than images and can to be as much as 90% smaller than SVG files. Now that a ton of options have emerged as popular choices among Web designers, we’ve made this brief list of 7 typefaces to point you in the right direction. Font Awesome (free) Font Awesome is an icon font that was designed to work perfectly with Twitter Bootstrap. Fontello (free) Modern Pictograms (free) Typicons (free) Yet another set of well-made, clean icons for Webfont use.

Vector Doodlekit Icons The Doodlekit Icons set contains 700+ hand-drawn icons for use in sketch-style wireframes. You can buy them in vector format to use in the design tool of your choice, or download the free set of 32 x 32 px PNGs. Here's a screenshot of the icons in the new custom icon feature that's available in the pre-release version of Mockups. More info here. Free fonts download 20 @fontface Icon Sets The pros for using @fontface icon sets far outweigh the cons. First of all, there are the obvious benefits of being infinitely scalable and being able to style them dynamically using any CSS property (color, gradients, shadow…). Secondly, its much easier to manage one single font file as opposed to juggling lots of individual images or having to create sprites. Thirdly, a single font file will only need a single HTTP Request for all the icons you use. And finally, just to round things off and finally convince you of the benefits of using @fontface icons, they look amazing. As @fontface icons are a relatively new trend that is slowly moving into the mainstream, there are very few icon-sets that are available in a font format. Modern Pictograms Number of Icons/Characters: 89 Price: Free License: Open Font License → Download Page: Modern Pictograms → Web Symbols Typeface Number of Icons/Characters: 77 Price: Free License: SIL Open Font License (OFL) → Download Page: Web Symbols Typeface → Fico

Related: