Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Fetching contributors…

Cannot retrieve contributors at this time

83 lines (56 sloc) 2.016 kB

Modules

WebFont Loader provides a generic module system so that any web font provider may be used. The specifics of each provider are documented here.

Google

Using Google's Font API, name the font families you'd like to load.

WebFont.load({
  google: {
    families: ['Droid Sans', 'Droid Serif']
  }
});

Learn more about the Google Font API.

Typekit

When using Typekit, specify the Kit to retrieve by its ID. You can find this ID within Typekit's Kit Editor interface.

WebFont.load({
  typekit: {
    id: 'xxxxxx'
  }
});

Learn more about Typekit.

Fontdeck

To use Fontdeck, specify the ID of your website. You can find this ID on the website page within your account settings.

WebFont.load({
  fontdeck: {
    id: 'xxxxx'
  }
});

Learn more about Fontdeck.

Fonts.com web fonts

When using Fonts.com web fonts

(First sign up for Fonts.com web fonts. Create a project, choose fonts to add into the created project and retrieve your Project ID. You can find this Project ID in the "Publish" tab).

<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
  WebFont.load({
    monotype: {
      projectId: 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx'
    }
  });
</script>

Or as pure Fonts.com Web fonts API

<script type="text/javascript" src="http://fast.fonts.com/jsapi/xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx.js"></script>

Custom

To load fonts from any external stylesheet, use the custom module. Here you'll need to specify both the url of the stylesheet as well as the font families it provides.

WebFont.load({
  custom: {
    families: ['My Font', 'My Other Font'],
    urls: ['/fonts.css']
  }
});
Jump to Line
Something went wrong with that request. Please try again.