Speckyboy Design Magazine » Fonts http://speckyboy.com Web Design News, Resources & Inspiration Thu, 24 Jul 2014 10:57:14 +0000 en-US hourly 1 20 More Sets of Free Icon Fonts http://speckyboy.com/2014/05/14/more-free-icon-fonts/ http://speckyboy.com/2014/05/14/more-free-icon-fonts/#comments Wed, 14 May 2014 11:10:43 +0000 http://speckyboy.com/?p=48816

Last year we published our very popular post 30 Free Icon Font Sets, and today we are back with another 20 fantastic free sets for you. Icon fonts do have their pitfalls and there are...


The post 20 More Sets of Free Icon Fonts appeared first on Speckyboy Design Magazine.

]]>


Last year we published our very popular post 30 Free Icon Font Sets, and today we are back with another 20 fantastic free sets for you.

Icon fonts do have their pitfalls and there are certain things you should consider before using them. To ensure that your icons always load and have reliable fallbacks for browsers that don’t support @fontface, you should take a look at the guidelines set-out by the Filament Group, Bulletproof Accessible Icon Fonts.

And just like they have their pitfalls, they also have their downsides. Ian Feather has recently discussed his reasons for switching from an icon font to SVG, and CSS Tricks have outlined some considerations when choosing between an icon font system or SVG. Both clearly favouring SVG.

As a counter-argument, Pictonic say that icon fonts are 10% faster than SVG.

Anyway, here are this years free icon fonts:

Free Icon Fonts 2014

Dashicons – The Official WordPress Admin Icon Font (197 Icons)

Dashicons is The Official WordPress Admin free icon fonts with 197 Icons

Dashicons Download Page →

Stroke 7 – An iOS7 Inspired Thin Stroke Icon Font (170 Icons)

Stroke 7 is An iOS7 Inspired Thin Stroke Icon Font with 170 Icons

Stroke 7 Download Page →

The Elegant Icon Font (360 Icons)

The Elegant Icon Font with 360 Icons

Elegant Icon Font Download Page →

Dripicons – A Completely Free, Vector Line-Icon Font (95 Icons)

Dripicons is A Completely Free, Vector Line-Icon Font with 95 Icons

Dripicons Download Page →

Iconia – An Icon Font With Three Styles: Regular, Circle and Cut (113 Icons)

Iconia is An free icon fonts With Three Styles: Regular, Circle and Cut with 113 Icons

Iconia Download Page →

Metrize Icons – A Metro-Style Icon Font (300 Icons)

Metrize Icons is A Metro-Style free icon fonts with 300 Icons

Metrize Download Page →

Icon Pack – A Line-Styled Icon Font from Petras Nargela (40 Icons)

Icon Pack is A Line-Styled Icon Font from Petras Nargela with 40 Icons

Line-Styled Icon Pack Download Page →

Ionicons – The Huge Icon Font for the Ionic Framework (528 Icons)

Ionicons is The Huge Icon Font for the Ionic Framework with 528 Icons

Ionicons Download Page →

Icons V.3 – A Free icon Font from by Hüseyin Yilmaz (24 Icons)

Icons V.3 is A Free icon Font from by Hüseyin Yilmaz with 24 Icons

Icons V.3 Download Page →

Genericons – An Icon Font from WordPress (123 Icons)

Genericons is An Icon Font from WordPress with 123 Icons

Genericons Download Page →

Open Iconic – A Highly Legible Icon Font (218 Icons)

Open Iconic is A Highly Legible Icon Font with 218 Icons

Open Iconic Download Page →

Linecons Free – A Free Line-Styled Icon Font (48 Icons)

Linecons Free is A Free Line-Styled Icon Font with 48 Icons

Linecons Free Download Page →

Outlined Icons by Dario Ferrando (150 Icons)

Outlined Icons by Dario Ferrando with 150 Icons

Outlined Icons Download Page →

Feather Icon Set – A Beautifully Simple Icon Font (130 Icons)

Feather Icon Set is A Beautifully Simple Icon Font with 130 Icons

Feather Icon Set Download Page →

Minimal – A Minimally Designed Icon Font (48 Icons)

Minimal is A Minimally Designed Icon Font with 48 Icons

Minimal Download Page →

The Icony Icon Font (100 Icons)

The Icony Icon Font with 100 Icons

Icony Download Page →

Icon Shock Icon Font (1286 Icons)

Icon Shock Icon Font with 1286 Icons

Icon Shock Font Download Page →

Goodies Icon Font (25 Icons)

Goodies Icon Font with 25 Icons

Goodies Download Page →

Stackicons Social Icon Font (75 Icons)

Stackicons Social Icon Font with 75 Icons

Stackicons Social Download Page →

Socialicious – A Social Media Icon Library (58 Icons)

Socialicious is A Social Media Icon Library with 58 Icons

Socialicious Download Page →

Mono Social – An Icon Font Based on the Mono Social Icon Set (100 Icons)

Mono Social is An Icon Font Based on the Mono Social Icon Set with 100 Icons

Mono Social Download Page →

Infinity Space Icon Font (230 Icons)

Infinity Space Icon Font with 230 Icons

Infinity Space Download Page →

Map Icons – An Icon Font for Use with Google Maps (150+ Icons)

Map Icons is An Icon Font for Use with Google Maps with 150+ Icons

Map Icons Download Page →

Weather Icon Font – A Weather Themed Icon Font (92 Icons)

Weather Icon Font is A Weather Themed Icon Font with 92 Icons

Weather Icon Font Download Page →


The post 20 More Sets of Free Icon Fonts appeared first on Speckyboy Design Magazine.

]]>
http://speckyboy.com/2014/05/14/more-free-icon-fonts/feed/ 0
A Gallery of Handmade Non-Traditional Fonts http://speckyboy.com/2014/04/04/gallery-non-traditional-fonts/ http://speckyboy.com/2014/04/04/gallery-non-traditional-fonts/#comments Fri, 04 Apr 2014 11:08:03 +0000 http://speckyboy.com/?p=47464

HandMadeFont are an Estonian based design company that specializes in creating in highly unique non-traditional fonts. Now when we say ‘non-traditional’, you are probably thinking that they perhaps design distorted styled fonts, or even cartoony...


The post A Gallery of Handmade Non-Traditional Fonts appeared first on Speckyboy Design Magazine.

]]>


HandMadeFont are an Estonian based design company that specializes in creating in highly unique non-traditional fonts. Now when we say ‘non-traditional’, you are probably thinking that they perhaps design distorted styled fonts, or even cartoony styled fonts. You know, the type of fonts that are not very common. But you would be wrong. They actually create really non-traditional fonts.

Have you ever worked on a project that needed a bacon font? How about a font made from onions? A coal font? Chopped meat font anyone? They really do create fantastic fonts from food and everyday objects. Check out their gallery below…

HandMade Non-Traditional Fonts Fonts

Bacon unique food Fonts handmade
Bacon Font

BBQ Non-Traditional Fonts handmade
BBQ Font

Brazil Paint unique food Fonts handmade
Brazil Paint Font

Chopped meat Font handmade
Chopped Meat Font

Coal Font handmade
Coal Font

eggs Font handmade
Eggs Font

onions Font handmade
Onions Font

reed Font handmade
Reed Font

Summer Leaves unique food Fonts handmade
Summer Leaves Font

HandMadeFont.com →


The post A Gallery of Handmade Non-Traditional Fonts appeared first on Speckyboy Design Magazine.

]]>
http://speckyboy.com/2014/04/04/gallery-non-traditional-fonts/feed/ 0
The Best Free Fonts for Coding & Programming http://speckyboy.com/2014/02/17/best-free-fonts-coding/ http://speckyboy.com/2014/02/17/best-free-fonts-coding/#comments Mon, 17 Feb 2014 13:01:10 +0000 http://speckyboy.com/?p=46877

You may have not given much thought to the font you currently use for coding before. You are probably happy with the default monospaced font that comes with your favorite IDE and over time have...


The post The Best Free Fonts for Coding & Programming appeared first on Speckyboy Design Magazine.

]]>


You may have not given much thought to the font you currently use for coding before. You are probably happy with the default monospaced font that comes with your favorite IDE and over time have become accustomed to it. These fonts may be the best font for you, but are they actually good for general coding? I would never tell you which font is good (currently I am using Ubuntu Mono Regular) or bad, as there is no way to categorically measure it. It does come down to each individual coders preference. But there are certain fonts freely available that have been designed purely with programmers and coders in mind.

With this post I just wanted to highlight some of the best free monospaced fonts that have been optimized for programming and to also offer some basic pointers for selecting a particular font.

So what should you be looking for in a good monospaced programming font? For starters it has to be clear and highly readable, proportionally-spaced, and for obvious reasons, needs to come packaged with an extended characterset with distinguishable glyphs. And perhaps more importantly than legibilty, the ’1′, ‘i’ & ‘l’ and ‘o’, ’0′ & ‘O’ have to be clearly identifiable as different characters. It is using this base criteria that I selected the free fonts below.

Quick note: For the screenshots I had intended to preview the fonts in Sublime Text using example code, but this proved to be far too impractical as the screenshots ended up being far too large when attempting to properly show the code in action. Instead I opted to use Flipping Typical, a handy web-based tool for previewing the fonts you have pre-installed on your computer, using the basic characters you can see below. Hopefully this will still give you a decent visual overview of what each font offers.

Free Monospaced Fonts for Coding

Anonymous Pro by Mark Simonson (Regular, Italic, Bold, and Bold Italic)

Anonymous Pro Regular Italic Bold free programming code fonts

Anonymous Pro Download Page →

Inconsolata by Raph Levien

Inconsolata free programming code fonts

Inconsolata Download Page →

Hermit by Pablo Caro (Light, Medium & Bold)

Hermit Light Medium Bold free programming code fonts

Hermit Download Page →

Edlo by Eric Hamiter

Edlo free programming code fonts

Edlo Download Page →

Meslo by André Berg (LG Small, LG Medium & LG Large)

Meslo free programming code fonts

Meslo Download Page →

Vera Sans Mono by Bitstream (Roman, Oblique, Bold & Bold Oblique)

Vera Sans Mono Roman Oblique Bold free programming code fonts

Vera Sans Mono Bitstream Download Page →

Fira Mono by Mozilla (Regular & Bold)

Fira Mono Regular Bold free programming code fonts

Fira Mono Mozilla Download Page →

PT Mono by Alexandra Korolkova (Regular & Bold)

PT Mono Regular Bold free programming code fonts

PT Mono Download Page →

Envy Code by Damien Guard (Regular, Italic & Bold)

Envy Code Regular Italic Bold free programming code fonts

Envy Code Download Page →

Ubuntu Mono by Dalton Maag

Ubuntu Mono free programming code fonts

Ubuntu Mono Download Page →

Liberation Mono by Steve Matteson for RedHat

Liberation Mono free programming code fonts

Liberation Mono Redhat Download Page →

Fantasque Sans Mono by Jany Belluz (Regular, Italic & Bold)

Fantasque Sans Mono Regular Italic Bold free programming code fonts

Fantasque Sans Mono Download Page →

Droid Sans Mono by Steve Matteson for Android

Droid Sans Mono free programming code fonts

Droid Sans Mono Android mobile Download Page →

Consolas Mono by Microsoft

Consolas Mono free programming code fonts

Consolas Mono Microsoft Download Page →

Drucifer Monospace by Drucifer

Drucifer Monospace free programming code fonts

Drucifer Monospace Download Page →

BPmono by Backpacker (Regular, Italic & Bold)

BPmono Regular Italic Bold free programming code fonts

BPmono by Backpacker Download Page →

DejaVu (Regular, Oblique, Bold & Bold Oblique)

DejaVu Regular Oblique Bold free programming code fonts

DejaVu Download Page →

Monaco by Susan Kare and Kris Holmes for OS X

Monaco apple mac OSX free programming code fonts

Monaco Download Page →


The post The Best Free Fonts for Coding & Programming appeared first on Speckyboy Design Magazine.

]]>
http://speckyboy.com/2014/02/17/best-free-fonts-coding/feed/ 0
40 Recently Released Free Fonts http://speckyboy.com/2014/01/27/40-recently-released-free-fonts/ http://speckyboy.com/2014/01/27/40-recently-released-free-fonts/#comments Mon, 27 Jan 2014 14:23:19 +0000 http://speckyboy.com/?p=46510

Struggling to find that particular font that matches your creative vision? Well, you have came to right place. For today’s post we have collected 40 recently (last 4-5 months) released fonts that will hopefully make...


The post 40 Recently Released Free Fonts appeared first on Speckyboy Design Magazine.

]]>


Struggling to find that particular font that matches your creative vision? Well, you have came to right place. For today’s post we have collected 40 recently (last 4-5 months) released fonts that will hopefully make your search that little bit easier.

All of the fonts in this post are free to use in both your personal and commercial projects. But please do check the licenses of each just to be clear, as they have been known to change from time to time.

Remember that typography has and always will play a critical and definitive role in how a user/reader interacts with your project. So when it comes to selecting your fonts please do “choose wisely“.

40 Free Fonts

Bebas Neue designed by Ryoichi Tsunekawa

Bebas Neuefont designed by Ryoichi Tsunekawa free font

Bebas Neue →

Asfalto designed by Fernando Forero

Asfaltofont designed by Fernando Forero free typeface

Asfalto →

Bitter designed by Huerta Tipografica

Bitterfont designed by Huerta Tipografica free font

Bitter →

Korneuburg Slab designed by Flö Rastbichler

Korneuburg Slabfont designed by Flö Rastbichler free typeface

Korneuburg Slab →

Barokah designed by Seruput Studio

Barokahfont designed by Seruput Studio free font

Barokah →

Fira designed by Mozilla

Fira free typeface

Fira →

Norwester designed by Jamie Wilson

Norwester free font

Norwester →

Kaiju designed by Anthony James

Kaijufont designed by Anthony James free typeface

Kaiju →

Homizio Nova designed by Álvaro Thomáz

Homizio Novafont designed by Álvaro Thomáz free font

Homizio Nova →

Quirky Nots designed by Amit Jakhu

Quirky Notsfont designed by Amit Jakhu free typeface

Quirky Nots →

Ormont designed by Youssef Habchi

Ormontfont designed by Youssef Habchi free font

Ormont →

Alegreya Sans designed by Huerta Tipografica

Alegreya Sansfont designed by Huerta Tipografica free typeface

Alegreya Sans →

Nauman Regular designed by The Northern Block

Nauman Regularfont designed by The Northern Block free font

Nauman Regular →

Sketchetik Fill Light designed by Ossi Gustafsson

Sketchetik Fill Lightfont designed by Ossi Gustafsson free font

Sketchetik Fill Light →

Ayres designed by Mariel Gornati

Ayresfont designed by Mariel Gornati free typeface

Ayres →

Kari designed by Javier Rivero

Karifont designed by Javier Rivero free font

Kari →

Southpaw designed by Tyler Finck

Southpawfont designed by Tyler Finck free typeface

Southpaw →

Sullivan designed by Jason Mark Jones

Sullivanfont designed by Jason Mark Jones free font

Sullivan →

Telex designed by Huerta Tipografica

Telexfont designed by Huerta Tipografica free typeface

Telex →

Exo 2.0 designed by Natanael Gama

Exo 2.0 - Geometric Sans Serif free font

Exo 2.0 →

Mohave designed by Gumpita Rahayu

Mohave Typefaces free typeface

Mohave →

Odin Rounded designed by Frank Hemmekam

Odin Rounded free font

Odin Rounded →

Hallo Sans designed by Fredrik Staurland

Hallo Sans free typeface

Hallo Sans →

Cuprum designed by Jovanny Lemonad

Cuprum free font

Cuprum →

Cosmic Sans Neue

Cosmic Sans Neue free typeface

Cosmic Sans Neue →

Figa designed by Pier Paolo

Figa free font

Figa →

SilverLeaf designed by Nathan Brown

SilverLeaf free typeface

SilverLeaf →

Neris designed by Eimantas Paškonis

Neris Web free font

Neris →

Hipstelvetica designed by José Gomes

Hipstelvetica free typeface

Hipstelvetica →

Carrois Gothic designed by Ralph Oliver du Carrois

Carrois Gothic Web free font

Carrois Gothic →

Dyspepsia designed by Ray Larabie

Dyspepsia free typeface

Dyspepsia →

Sifonn designed by Rafa Goicoechea

Sifonn free font

Sifonn →

Peyo Regular designed by Shannon Lim

Peyo Regularfont designed by Shannon Lim free typeface

Peyo Regular →

Esqadero FF CY designed by Sergiy Tkachenko

Esqadero FF CYfont designed by Sergiy Tkachenko free font

Esqadero FF CY →

Lousiane designed by JuanJo Rivas del Rio

Lousiane free typeface

Lousiane →

Born Free designed by Carlos De Toro

Born Free free font

Born Free →

Tryst designed by Philatype

Trystfont designed by Philatype free typeface

Tryst →

Gaspar designed by Carlos Alonso

Gasparfont designed by Carlos Alonso free font

Gaspar →

Corduroy Slab designed by Ryan Welch

Corduroy Slab OT free typeface

Corduroy Slab →

Corbert Condensed designed by The Northern Block

Corbert Condensed Regular & Italic +Web Font free font

Corbert Condensed →

Verb Condensed designed by Yellow Design Studio

Verb Condensed Regular & Italic  +Web Font free typeface

Verb Condensed Regular →

Dense designed by Charles Daoud

Dense free font

Dense →

Canter designed by Christopher J. Lee

Canter free font

Canter →


The post 40 Recently Released Free Fonts appeared first on Speckyboy Design Magazine.

]]>
http://speckyboy.com/2014/01/27/40-recently-released-free-fonts/feed/ 0
Good Font, Bad Font: 5 Ways To Tell The Gems From The Junk http://speckyboy.com/2013/11/14/good-font-bad-font-5-ways-tell-gems-junk/ http://speckyboy.com/2013/11/14/good-font-bad-font-5-ways-tell-gems-junk/#comments Thu, 14 Nov 2013 08:43:12 +0000 http://speckyboy.com/?p=45352

Type can be confusing for designers today, who have access to thousands upon thousands of different fonts, many of which are free to download and use. This results in an overabundance of typographical solutions to...


The post Good Font, Bad Font: 5 Ways To Tell The Gems From The Junk appeared first on Speckyboy Design Magazine.

]]>


Type can be confusing for designers today, who have access to thousands upon thousands of different fonts, many of which are free to download and use. This results in an overabundance of typographical solutions to problems that aren’t really so complicated. Today, we’re going to look at 5 key rules for selecting an ideal typeface for any project, and how to determine if that font you think is amazing may not be so great after all.

1. You Don’t Need As Many Typefaces As You Think You Do

When I was in school, my type teachers would stress that graphic designers really only need around 5 or 6 ‘default’ typefaces that they can use to handle 99% of all possible scenarios. This has the effect of giving your design work a very distinctive look; only using 5 fonts for everything will clue people in faster as to who the designer is. It can become a bit monotonous though, and, if done incorrectly, can make your work look awkwardly limited.


[Images Source]

However, that doesn’t mean it isn’t good advice to stick to a particular ‘palette’ of fonts for the most part. If you learn the fundamentals of type, you can get a lot more versatility out of even a single typeface than many type novices think is possible. Type can be altered, tweaked, spliced, and shaped to fit a variety of needs. Many of the newer fonts out there were created from classic ones anyway. It’s all about making sure the changes are seamless and look like they were always part of the letterform.

2. Check For Telltale Signs Of Auto-Tracing Or Lumpy Vectors

Back before digital took over the print world, type was created by actual foundries, which offered sets of metal letterforms to be loaded into a printing press. A common problem with a lot of modern digital fonts (even the ones you have to pay for) is that the ‘foundry’ that designed the typeface cut corners to produce it. They might have taken scans of printed letterforms, auto-traced them in Illustrator, and put them into FontLab or a similar program without bothering to clean them up or correct any errors created by the software.

Display fonts are meant to be shown at large sizes, and when you have one that’s poorly drawn, it’s going to be that much more obvious when it’s blown up to the necessary size. A good typeface should be just as elegant and readable at size 10 as it is at size 84. If it isn’t, consider looking for a different one. If you need a display font, make sure the vectors are clean and elegant, with no signs of lazy auto-tracing. It’s easy to create outlines of any typeface in Illustrator to see whether it’s a prize or a dud.

3. Don’t Forget About The Symbols!

Symbols, numbers, ligatures, and dingbats may not seem important… until you need one and are forced to improvise or borrow from a different font. It’s much easier and more cohesive for your design to just pick a font that has all the symbols you need. Believe me, even if you think you’ve found the ‘perfect’ typeface, if it’s not complete enough for your project, you are going to be kicking yourself as your next deadline approaches. Before you commit to an incomplete font, check to see if there isn’t a better option that’s just as good, which won’t have you scrambling to fill in the gaps.


[Images Source]

4. Pulling Your Own Weight

Remember all that rambling about type weights you slept through in design school (don’t pretend like you didn’t)? Well, as it turns out, it was a vital piece of the typography puzzle. Like symbols, type weights (bold, italic, etc.) only seem insignificant as long as you don’t absolutely need them. Of course, there are plenty of faces – roman capitals and many stencil or pixel fonts – that only come in one weight. If you choose to work with one of these fonts, it’s important to take their limitations into account before you begin your project.

5. Application Is Everything

Are you using a web font, a print font, or a combination of the two? There is a difference, and it does matter. Web fonts are designed to be read on a computer screen. They are typically sans serif, like Arial or Tahoma, although there are serif fonts, like Georgia, which are intended for digital applications as well. Fonts meant for print are older and more classic, like Bodoni, Baskerville, or Goudy, and the best ones can be perfectly suited to web design with just a few tweaks to their curves and spacing.


[Images Source]

Modern typefaces like Helvetica look great both on and off screen. The popular Helvetica Neue was specifically created for digital design, relying heavily on Helvetica’s classic letterforms. Just like celebrity break-ups and recipes for black forest cake, typefaces can be googled. With a simple search, you can find out a font’s origins, whether it was created for print or digital, and whether there is an updated version that might be better for your design.

What Do You Think?

How do you choose typefaces for your design projects? Have any special insights you’d like to share? We’d love to hear about it in the comments below.


The post Good Font, Bad Font: 5 Ways To Tell The Gems From The Junk appeared first on Speckyboy Design Magazine.

]]>
http://speckyboy.com/2013/11/14/good-font-bad-font-5-ways-tell-gems-junk/feed/ 0