Use a custom font that a user does not have installed

Question

Possible Duplicate:
How to use web-fonts legally?
Using a custom (ttf) font in CSS

Just a simple one - wondering if I say, find a nice font to use that the user is probably not going to have installed, is there a way I can use it without it being installed on a users computer? I mean without making it an image?

John Conde · Accepted Answer · 2019-04-22T11:44:34.873

8

You need to use CSS's @font-face

edited Apr 22 '19 at 11:44

answered Jun 06 '12 at 15:35

John Conde

217,595
99
455
496

the link is dead. – john-jones Apr 22 '19 at 09:05
@HermannIngjaldsson Thank you for pointing that out. Updated with a newer more authoritative source – John Conde Apr 22 '19 at 11:45

score 4 · Answer 2 · answered Jun 06 '12 at 15:38

Yes, you can use CSS3 @font-face. You'll have to upload font files inside your server in special formats. Be sure that font's licence allows that.

You can find selection of free-to-use fonts on http://www.fontsquirrel.com/, which also provides generator for CSS properties and converts font files to needed formats.

WhoaItsAFactorial · Answer 3 · 2012-06-06T16:56:01.457

2

In CSS use the following. You will need to convert your .ttf to a .eot to work with IE properly.

@font-face { 
   font-family: "SFSpeedway"; 
    /* IE */
    src: url(./fonts/fontname.eot');
    /* IE */

    /* Not IE */
    src: local("SF Speedwaystar Condensed"), url(./fonts/fontname.ttf');
    format("truetype");
    /* Not IE */
}

edited Jun 06 '12 at 16:56

answered Jun 06 '12 at 16:01

WhoaItsAFactorial

3,538
4
28
45

score 0 · Answer 4 · answered Jun 06 '12 at 15:39

you can use css's @font-face if the font is available that way - keep in mind that using it affects your page loading time and this could also affect performances on slow (mobile) connections.

otherwise it's safer to have fallback fonts:

font-family: helvetica neue, arial, serif;

you could also look at cufon but I personally don't like it

Use a custom font that a user does not have installed

4 Answers4