42 Responses to “10 Great Free Fonts for @font-face embedding”

1. 

   Brett
   

   05. Aug, 2008

   Nice summary. Having real small caps makes me more excited than it probably should.
2. 

   Affordable Web Design
   

   09. Aug, 2008

   Interesting set of fonts. I’m eager to see well the new technology will play out in the other browsers. Thanks for posting!
3. 

   paresh
   

   09. Aug, 2008

   great typopgraphy, thanks for sharing.
4. 

   Charles Forster
   

   11. Aug, 2008

   Graublau isn’t free.
5. 

   ralfherrmann
   

   11. Aug, 2008

   Graublau isn’t free.

   The “Graublau Sans Pro” family isn’t, but the two styles “Graublau Sans Web” regular and bold are.
6. 

   pitje
   

   11. Aug, 2008

   please define ’soon’
7. 

   ralfherrmann
   

   13. Aug, 2008

   please define ’soon’

   It’s scheduled for Firefox 3.1 to be released later this year.
   Opera had already a build with @font-face support, but it didn’t make it in the final release of 9.5. So it’s very likely to be in Opera 10.
8. 

   johno
   

   13. Aug, 2008

   Great that you’ve shared them here, and that you’ve gone to the trouble of creating a demon page. Thanks.
9. 

   Pxl_Buzzard
   

   16. Aug, 2008

   This would be an awesome feature in Firefox, seeing as it’s the only browser I use. As a web designer, I hate being limited to only a few “safe” fonts.
10. 

    projectgrafix
    

    16. Aug, 2008

    #4 font looks very nice, however using websafe fonts is good for webpages, otherwise most people complain of ugly looking site. For images, any font is good
11. 

    Emma Best
    

    02. Sep, 2008

    Nice set of fonts. I like no. 5 and 7 the best. Thanks for sharing
12. 

    Bill Canaday
    

    04. Sep, 2008

    Okay … I’ll bite. How would I embed these in a web page if the viewer has not already downloaded a copy?

    I’m not trolling … I Stumbled in here and this sounds interesting but I wouldn’t know where to begin.
13. 

    ralfherrmann
    

    04. Sep, 2008

    Here are code examples:
    http://www.webfonts.info/wiki/index.php?title=%40font-face_support_in_Safari
14. 

    David Dickey
    

    26. Sep, 2008

    Are browsers going to use kerning information?
15. 

    ralfherrmann
    

    26. Sep, 2008

    Firefox 3.x already supports kerning. Webkit/Safari could use it, but the developers claimed they turned it off for performance reasons.
16. 

    ksng
    

    26. Okt, 2008

    Well article and well resources, thanks a lot!
17. 

    Amanda Evans
    

    29. Okt, 2008

    What a great set of fonts. These will definitely come in handy when I get around to redesigning my website. Thanks for sharing.
18. 

    Bill
    

    02. Dez, 2008

    So if I understand this correctly, this should make sense.
    If not please tell me.

    Safari and IE already allow this using CSS but only with .oet fonts? (Safari also .ttf)

    When Firefox and Opera support this they will only support .ttf fonts?

    Will this allow the website maker to use what ever font they like to be used on the website? (as long they are ttf. or .oet)

    So when this all happens. Is there away to load the same font in both extension so not only people using firefox will see it, or vise versa.

    I have been going through all the developers sites and it seems that firefox is just about to allow this but then I also read about people not even being allowed to use .oet in IE 7

    This is all just so confusing right now and I was hoping you could shine some light on this Ralf?

    regards,
19. 

    ralfherrmann
    

    03. Dez, 2008

    Safari (from 3.1): OTF/TTF
    IE (from 4): EOT
    Firefox (3.1): OTF/TTF

    If it should work in all of them, you need to provide both versions, one EOT for IE and one OTF or TTF for the others.
    You can find more informations on webfonts.info:
    http://webfonts.info/wiki/index.php?title=%40font-face_browser_support
20. 

    Snooper
    

    10. Jan, 2009

    What am i missing ? This code is apparently Firefox safe and is to embed a font (from here) .. but its not working ??!!

    Font test

    @font-face {
    font-family: “Fontin Regular”;
    src: url(“/Fontin-Regular.ttf”) format(“truetype”);
    font-weight: bold;
    }

    H1 { font-family: “Fontin Regular”, arial }

    This heading is displayed using Fontin Regular
    This is normal system text

    live sample – http://www.ihost4u.co.uk/font.html
21. 

    nev
    

    29. Apr, 2009

    Hi all the fonts are good . we love the batman font
22. 

    Scarf*oo
    

    20. Mai, 2009

    Haven’t jumped on the bandwagon myself yet, but I am feeling the day approaching when I’ll embed my first font on a real site. No 4, 5, 7 and 10 for me, thank you.
23. 

    Hardy
    

    20. Mai, 2009

    Free fonts are always a great thing. And these fonts are awesome. Thank you!
24. 

    Neefra
    

    20. Mai, 2009

    WAOOOOO……………..
    NICE FONTS DESIGNZZ
25. 

    Richard Fink
    

    21. Mai, 2009

    None of these fonts is particularly useful except for headings.
    None of them useful for body text. They don’t render well at smaller sizes.
26. 

    ralfherrmann
    

    21. Mai, 2009

    That’s why I say “10 great headline fonts” in the article …
27. 

    gwynne
    

    22. Mai, 2009

    some really nice fonts in there!.. thanks.
    i particulary like 8. Kaffeesatz. will use it soon on a website design i should imagine!
28. 

    web services
    

    22. Mai, 2009

    Expecting the fonts to be approved for Firefox and Opera, I really love those fonts. Few among them are getting the attraction on the first sight. I will be using some the above in my next web designs.
29. 

    David Evans
    

    02. Jun, 2009

    I cannot believe we are still having this conversation. I think I was embedding fonts in 1999, it was a pain then and given the ongoing fractured nature of the browser wars, unless there is a spec and everyone agrees on it, nothing is going to change.

    No way anyone with a large site is going to try and implement this stuff, it’s like the IE box hack all over again. A shame.
30. 

    ralfherrmann
    

    02. Jun, 2009

    The specs are here, since 2002:
    http://www.w3.org/TR/css3-webfonts/
31. 

    qamarneo
    

    03. Jun, 2009

    This collection is really nice. I will be using a couple of them in my upcoming project. Thanks
32. 

    Patelligence
    

    04. Jun, 2009

    Thanks for posting this. It is very helpful.
    I especially appreciate the second font: Fertigo Pro.
    Tallys is pretty sweet, too.

    Keep up the good work!
33. 

    paul
    

    11. Jun, 2009

    very nice fonts! like it. do i need to embed these fonts when i publish the site? or is it the case that they will appear in when firefox has them? or already the case that they have them?

    thanks a lot
34. 

    ralfherrmann
    

    11. Jun, 2009

    do i need to embed these fonts when i publish the site?

    You should upload them to your server and link them from the CSS file.
35. 

    Divya
    

    12. Jun, 2009

    this list is really helpful..and would love to sue these fonts. esp the 4th one
36. 

    lee norwich
    

    16. Jun, 2009

    Great stuff. The font-face embedding really notes a noticable step forward in visual web design, how long until the majority of users can see these fonts though?
37. 

    Sam
    

    25. Jun, 2009

    Thanks so much for sharing these great font with us, Graublau Sans Web is my favorite.

38. Embedden Sie jetzt! | Code Candies
    

    30. Jun, 2009

    [...] die man auch fürs embedding benutzen darf, sonst gibt’s schnell Lizenzärger. Hier gibt’s ein paar freie Schriften, die das ausdrücklich zulassen. Ach ja und zum guten Schluss, sollte man font-size-adjust auf [...]
39. 

    ed hardy
    

    04. Aug, 2009

    This collection is really nice. I will be using a couple of them in my upcoming project.
40. 

    Webdesign Agentur
    

    30. Aug, 2009

    In what browsers exactly will the @font-face property work? I’ve always wanted to know this. I know that it works in the latest Safari, but how about earlier versions?
41. 

    ralfherrmann
    

    31. Aug, 2009

    In what browsers exactly will the @font-face property work?

    See http://www.webfonts.info
42. 

    NIFT
    

    19. Sep, 2009

    Usually I’m a little scared of free fonts because of all the tweaking they require but this is a solid little collection. Thanks so much!