As the Foundation we know today starts to take its place on the shelf, we start looking forward and executing on our master plan for the future. Foundation 3.0 is going to be epic! We're not just going to make it the fastest framework for prototyping quickly and building solid production sites that present well on any device, but it's also going to help you create better designed sites.
Today, we're revealing part of this plan — a small glimpse into the long list of additions and modifications Foundation 3.0 will include. We decided to whet your appetite with the first installment of our new Foundation Icon Font Sets!
Custom Icon Fonts FTW!
We've gotten a few requests for icons inside of Foundation. A few of us in the office have even mentioned it. We bought a program so we could test out the process for creating a custom font out of vector shapes. This test got us excited about the possibilities for styling such a font. We'd be able to include any number of these icons at any size, color or CSS style we could imagine. This gives us ultimate control over the icon sizes we use for various device sizes without the need to save multiple versions of the same icon. We were sold, it was time to move forward with implementation.
What was the process?
Once we pulled the trigger on this idea, we quickly came up with an initial list of icons that we thought were generally useful to UI and web designers. We iterated quickly and settled on the set you can download today. While it's hard to re-invent how to illustrate an arrow glyph, we tried to give our glyphs a unique style of their own.
After the icons were designed, it was time to map them to characters on the keyboard and export them into our font sets. Our initial offering is three icon font sets; that's over 100 icons! You'll be able to download it today and get started using them.
What's the benefit?
By having glyphs that exist as a font, you get the advantage of scalability. Now you can have icons ready to go in any size, color and style. You can even use some awesome CSS text styles like shadows and gradients to make them feel less like a glyph. Forget about copy and pasting from Illustrator to Photoshop only to have the pixel edges look fuzzy. Now you'll get the same crispness that you get out of any font rendered on the web.
Download it today!
We're showcasing our pre-release of this font set on our playground. Get over there and download it, the Foundation Yeti commands you! If you don't, forget about extra glyphs in your stalkings this year.
We'd love to hear any suggestions for glyphs to include in the final set. We have over 200 spaces to fill in a character set, let us know!
Check out Foundation Icons on the Playground »
