• Search
  • Post Categories
  • Design & Dev
  • Freelance
  • Galleries
  • Graphic Design
  • GUI
  • Mobile Dev
  • Photography
  • Resources
  • UX
  • Pages
  • About Us
  • Contact Us
  • Advertise
  • Write for Us
  • Categories
  • Archives
  • Recommended
  • Popular
  • iOS App
  • Filter Posts
    • Design & Dev
    • Freelance
    • Galleries
    • Graphic Design
    • GUI
    • Mobile Dev
    • Photography
    • Resources
    • UX
    • All Categories →
  • Archives
  • Search
SDM Demo
  • Magazine
  • Popular
  • Recommended

25 Completely Free Fonts Perfect for @fontface

July 4, 2010 by Paul Andrew Fonts, Resources, Web Design

  • Facebook
  • Twitter
  • Google+

The recent web design trend of not using web safe fonts for headlines and titles has opened up a whole new resource category for designers: The search for the perfect headline grabbing font.

In this post we have collected 25 of the best completely FREE headline fonts that could be easily used with @fontface property and all packaged with a web-font license.

Font Squirrel offers a really easy to use @fontface generator, click the “Add Fonts” button, check the agreement and download your fonts. Simple as that. You can visit it here: Font Squirrels @fontface Generator »

Dekar

DekarDekar Download Page →
Freeware License (View License)

Sertig

SertigSertig Download Page →
Free For Personal or Commercial Use (View License)

Cicle Family (7 styles)

Cicle FamilyCicle Family (7 styles) Download Page →
Freeware License (View License)

Anivers

AniversAnivers Download Page →
Free For Personal and Commercial Use (View License)

Chunk

ChunkChunk Download Page →
SIL Open Font License (OFL) (View License)

Museo

MuseoMuseo Download Page →
Free For Personal and Commercial Use (View License)

Prociono

ProcionoProciono Download Page →
SIL Open Font License (View License)

Josefin

JosefinJosefin Download Page →
SIL Open Font License (View License)

Hattori Hanzo

Hattori HanzoHattori Hanzo Download Page →
Creative Commons Attribution 3.0 Unported (View License)

Raleway

RalewayRaleway Download Page →
SIL Open Font License (View License)

Jura

JuraJura Download Page →
Free for Personal and Commercial Projects (View License)

Telegrafico

TelegraficoTelegrafico Download Page →
Free for Personal Use (View License)

Museo Slab

Museo SlabMuseo Slab Download Page →
Free For Personal and Commercial Use (View License)

Ripe

RipeRipe Download Page →
Creative Commons Attribution 2.5 Australia License (View License)

Bebas

BebasBebas Download Page →
Freeware License (View License)

Junction

JunctionJunction Download Page →
SIL Open Font License (View License)

Quicksand

QuicksandQuicksand Download Page →
Free For Personal and Commercial Use (View License)

Camisado

CamisadoCamisado Download Page →
SIL Open Font License (View License)

Code

CodeCode Download Page →
Freeware License (View License)

Kilogram

KilogramKilogram Download Page →

Nevis

NevisNevis Download Page →
Free For Personal and Commercial Use (View License)

League Gothic

League GothicLeague Gothic Download Page →
SIL Open Font License (View License)

St Marie

St MarieSt Marie Download Page →
Creative Commons – Attribution 3.0 Unported (View License)

Cantarell

CantarellCantarell Download Page →
GNU General Public License (View License)

Franchise Bold

Franchise BoldFranchise Bold Download Page →
Freeware Fonts License (View License)

You might also like…

Top 20 Free Fonts for Distinctive Headlines and Titles »
34 Free and Elegant TrueType Mini Pixel Fonts »
25 Distinctive and Famous Logo Photoshop Tutorials »
20 Inspirational Resources for Logos and Logotypes – Get Creative! »
15 Amazingly Free Magazine and Headline Fonts »
Top 28 Free Font Directory Resource Sites »
Top 15 Inspirational Typograhy and Font Blogs »

Author: Paul Andrew (566 Posts)

Paul Andrew is the editor and founder of Speckyboy Design Magazine. You can follow Speckyboy on Twitter, on Facebook, on Digg or you can subscribe via RSS.

Next Post →← Previous Post
  • Pingback: گالان هاست | Galan Host » 25 Completely Free Fonts Perfect for @fontface

  • http://telek.pp.ua/ Oles

    Nice fonts, thanks

  • dpi

    Awesome collections. Thanks

  • Pingback: Web Mee

  • http://www.fantasticode.com Charlie Hawker

    Really like Raleway by Matt McInercy above – really nice font – very elegant – and I look forward to using it somewhere.

  • Pingback: 25 Completely Free Fonts Perfect for @fontface – Speckyboy Design Magazine : Popular Links : eConsultant

  • http://boundaryconditions.org ron

    thanks for this post – would like to see a review some good international fonts for utf8 based sites. Which ones cover japanese, hindi and still look great?

  • Pingback: 25 Completely Free Fonts Perfect for @fontface | Lively Design Tuts

  • http://www.johnalexanderrowley.com/ John Alexander Rowley

    Brilliant set of fonts! Must be bookmarked – Catagorized into a good set of choices for web developers and designers!

  • http://www.web-design-brasov.ro Alex Flueras

    Great article, superb fonts. Thanks for sharing!

  • Jason

    Here’s another resource that might help – there are loads of fonts on here that can be used for commercial purposes: http://www.fontsquirrel.com/

    (I’ve no affiliation with them at all, I just use them)

  • http://hiredgunscreative.com Reed Botwright

    Thanks for this! Now our Creative Director will be out of commission for a few hours!

  • http://www.studiokarlescritt.co.uk karl escritt

    Great set of fonts, quite a few i havnt seen before and will be looking to use in upcoming projects

  • http://www.blueprintgroupe.com Blueprint Groupe

    Really liking the Code and Raleway fonts. I’ve only used @font-face once so I think I’ll check out Font Squirrel to see what they can offer.

  • http://www.vectorbunker.com Vectorbunker

    Nice collection thx for sharing

  • http://www.amateursuperhero.com/ Rob Blatt

    If CODE was a girl, she’d be pregnant with my baby.

  • Pingback: links for 2010-07-05 « Mandarine

  • Pingback: links for 2010-07-05

  • http://www.lienaaifen.com Liena Aifen

    nice article thanks for sharing the fonts. it’s really fantastis

  • http://www.fuelmediaworks.com Leroy Fernandes

    Very beautiful fonts.
    Thanks for rounding them all up in one place.

    Bookmarked!!

  • Pingback: 25 Completely Free Fonts Perfect for @fontface | RefreshTheNet

  • http://www.crearedesign.co.uk/ Jarkko Sibenberg

    Most of them seem actually useful. There’s something nice about the corners in Prociono. I want to use it somewhere now.

    I also like Bebas and Raleway since they’re quite basic but still stylish.

    Thanks for sharing.

  • Pingback: Znalezione z rana ciekawe linki | Hekate Design Wdrożenia WWW

  • Linus

    Too bad several of the fonts are only A-Z.
    International web sites do need special characters and there are less options.

  • Pingback: PROOF! My 10 Year Old Makes $1ka month Proof! | quick ways to make money

  • http://www.mightymeta.co.uk James Brocklehurst

    Nice roundup. Any information on how these fonts look when not anti-aliased in XP?

  • http://www.ignitethespark.wordpress.com Laurie

    Great addition to my staid collection… thanks!

  • Pingback: 25 Completely Free Fonts Perfect for @fontface | Design Newz

  • Pingback: 25 Completely Free Fonts Perfect for @Fontface | TechFleck

  • Pingback: 25 gratis fonts | Computertaal

  • Vince

    Really great fonts, I’ll be making use of those

  • http://www.gunnertech.com Cody Swann

    Font squirrel is the best. But use with caution. font-face causes your text to ‘blink’, looks different on different browsers and should probably be avoided for body text

  • http://www.faestudio.com Talasan Nicholson

    It would be great to see a demo of them with @font-face!

  • http://hector-lee.com Hector Lee

    I’m not too sure about the licenses for all the fonts but I could not find the @font-face licensing for ‘ripe’ and ‘kilogram’. I do believe that a commercial license does not automatically allow @font-face embedding. The license needs to be stated explicitly.

  • http://www.multyshades.com Multyshades

    Really useful list of fonts, thanks for share

  • http://www.evographics.com Evo

    I’m liking Nevis a lot!

  • Pingback: 25 Completely Free Fonts Perfect for @fontface | Dev Loom

  • Pingback: risorse&link | Art&Me

  • http://www.sjlwebdesign.co.uk SJL Website Design

    Sweet set of fonts, can’t wait to try some out. I Really like the look of ‘Raleway’ and ‘Jura’!!

    Thanks for sharing these.

  • Pingback: Design Friday: Fondos orientales y recursos

  • Nico Vera

    Nice collection.. Excelent !

  • Pingback: İşe yarayan kaynaklar-1 | Mustafa TURHAN

  • http://www.cruzine.com oliver

    Thanks for this cool free fonts, some new for me there.

    100 Free Fonts You Should Have in Your Library – http://www.cruzine.com/2010/06/16/100-free-fonts-library/

  • http://inter-climat.com.ua Кондиционеры митсубиши

    Thanks, exactly what i looking for!

  • http://www.devanagarifonts.net Mohit

    Wow! really nice fonts. Thanks…

  • Pingback: Webnews #16: Twitter, Marketing und Google | Andi Licious' Blogosphäre

  • Moke

    Thank you very much. Yeah !!!!!!!!!!!! many fonts.

  • http://www.ogvidius.com/ Ogvidius

    Bookmarked this page a while ago and I still keep coming back. Brilliant list of fonts. Thanks!

  • http://www.503websolutions.com Jason Schmidt

    Yeah, Free fonts FTW!

  • Pingback: CSS3 Compatabilty Tools, Resources and References for Internet Explorer | Prabaharan CS Blog

  • Pingback: 30 CSS and Javascript Tabs Solutions « infomisa.net

  • http://esdev.net Shawn

    Nice collection.

    I usually find mine at fontsquirrel. They have an @font-face kit for all the fonts on their site and a generator for others.

    I love nevis, but one thing I’ve noticed is that if you use it in all caps, the text heights are too ragged.

    Haven’t noticed this in other @font-face fonts, but definitely wonky in nevis.

    That said, it looks passable when used as normal case.

  • http://blog.markwong.co.uk/ Mark

    Thanks for these :)

  • http://store.opencarter.com Opencarter

    Yeah, absolutely great collection. I agree Bold is fantastic. Sooo elegant.

  • Ruth

    @fontface works well – provided you use it correctly..

    Firstly – that “blink”, is apparently known as “fout” and can be sorted with a line of javascript – I found the answer here:

    http://paulirish.com/2009/fighting-the-font-face-fout/

    As for the number/type of characters in a font – font squirrel allows you to decide what of the available characters you want included in your pack and does allow yuo to preview all available characters.

    There is a “shortcut” – for specifying all weights of a font, which involves “tweaking” the provided css. Every weight carries it’s own name.. shorten the name, so all weights have the same name.. e.g. Avenir
    Then be sure to specify the correct font style and weight in the font css – this is important to have a “real” bold/italic and not a browser “faux” bold/italic. When you then add your font to your font family, you have access to all weights and not faux weights.

    Hope that helps.

  • Pingback: CSS Form Templates, Tools & Services

  • Pingback: Ultimate Guide of Web Typography Tutorials, Tips and Best Practices | CS5 Design

  • Pingback: Athenna Design | Ultimate Guide of Web Typography Tutorials, Tips and Best Practices | athenna-design é uma Empresa de Design de Comunicação Em Foz do Iguaçu

  • Pingback: Web Typography Tutorials, Tips and Best Practices | GRAPHIC & WEB DESIGN GUIDE RESOURCE

  • Pingback: Polices @Font-Face 100% gratuites| Webmaster – Ressources et outils gratuits pour votre site internet – Free Tools| Free Tools, Le meilleur des outils gratuits pour webmaster

  • Tugba Akdagg

    THANKS, for perfect fonts!

  • ImmaToey

    thank you so much

Subscribe & Follow

  • RSS36K+
  • Google+4.5k+
  • Twitter46k+
  • Facebook24k+

RSS in your Inbox

To recieve our RSS updates via email, enter your email address below.

  • Popular
  • Recommended
php_01

PHP Tutorials for Beginners

May 14, 2013

new_jquery_thumb

30 New jQuery Plugins Worth Taking a Look At

May 8, 2013

bootstapp_tools_thumb

Bootstrap Toolbox – Tools, Utilities, Generators and Templates

May 1, 2013

wireframe_thumb

30 Wireframe Templates and Toolkits

April 29, 2013

april_freebie_thumb

The Best Freebies for Web Designers (April 2013)

April 25, 2013

View More Popular Posts   →

tabbed-navigation-dark-sidebar-links

User Experience Trends for Admin Dashboards

May 16, 2013

pricing_02

The freelance pricing trap and how to get out of it

May 13, 2013

fireworks_extensions_thumb

Adobe Fireworks Extensions & Commands for Web Designers

May 13, 2013

digital_thumb

Landing Page Design Trends for Selling Digital Products

May 9, 2013

speed_thumb

Tools, Tips and Tricks for a Blazing Fast Website

May 6, 2013

View More Recommended Posts   →

Our iOS App by Mobiloud

Pages

  • About Us
  • Contact Us
  • Advertise
  • Write for Us
  • Categories
  • Archives
  • Recommended
  • Popular
  • iOS App

We are hosted by...

...and accelerted by...

Copyright © 2013     Speckyboy Design Magazine