Publishing your kit

Your kit must be published any time you make a change, such as adding new fonts or updating the domain listing. You may also need to republish a kit to access new features, such as updated browser support. Publishing your kit is a good first step in resolving font loading problems. To republish a kit, select the name from the kit menu, which opens the kit editor. Click the Publish button, and the updates are available to your website within a few minutes.

Contacting Typekit Support

If the steps below don't get the fonts working on your website, send the output of the Typecheck tool to support@typekit.com for further help.

What are you having trouble with?

Fonts aren't working in any browser

Problem Solution
The domain name isn't listed on the kit, or the kit hasn't been republished since adding it.

There will be an error in the browser console:
Typekit: the domain "[domainname]" isn't in the list of published domains for kit "[kitID]".
  1. Add the domain name to the kit
  2. Republish the kit by clicking the republish button on your kit index page.
Embed code is missing from site. Add the embed code to your site.
Typekit font name hasn't been added to the CSS. Add the font name by:
  • Adding CSS selectors to your kit
  • Using the provided font-family names in your own CSS

For more information on both options, see CSS selectors.

Ghostery browser extension is blocking Typekit. Go to Options > Blocking Options > Trackers > Widgets and deselect Typekit by Adobe.
The browser referrer isn't being sent.

Use the Typecheck tool to confirm whether the browser referrer is sent.

If it isn't being sent, check for browser extensions that may have been turned off or blocked the referrer.

You can also remove the referrer by a meta tag in the web page:
<meta name="referrer" content="no-referrer"/>

Fonts aren't working in mobile browsers

Problem Solution
The browser isn't supported. Browser and OS support
The correct font weight or style isn't specified in the CSS. If a font weight or style isn't available, many mobile browsers will not display the font and use the fallback instead. Make sure that the weight and style you want to apply are included in your kit and that they are specified correctly in the CSS.

Firefox isn’t showing the fonts but other browsers are

Problem Solution
Referrer turned off in hidden preference.

The browser sends a referrer by default, but some add-ons change this preference.

  1. Open a new browser tab and type about:config in the address bar.
  2. Enter network.http.sendRefererHeader in the search field.
  3. Set the value to 2 (not 0 or 1). To change it, double-click the preference row.
Downloadable fonts turned off in hidden preference.

Another hidden preference disables downloadable fonts.

  1. Open a new browser tab and type about:config in the address bar.
  2. Enter gfx.downloadable_fonts.enabled in the search field.
  3. Set the value to true. To change it, double-click the preference row.
Browser preference to override user fonts is turned off. A preference determines whether custom fonts may override the user's browser settings. Under Preferences > Content > Fonts & Colors > Advanced, select the Allow pages to choose their own fonts option.

Internet Explorer isn’t showing the fonts but other browsers are

Problem Solution
Document mode is set to an older version of the browser [IE9 or higher].

Using a different document mode will result in the wrong font file format being served to the browser; read more in this blog post.

Remove meta tags that tell IE to use a different document mode, such as <meta http-equiv="X-UA-Compatible" content="IE=8">

Browser preference to disable downloaded fonts is turned on [IE8]. A security setting can disable all downloadable fonts. Under Tools > Internet Options > Security > Custom level > Downloads, look for Font Download. Enable font downloads with the default security level. If security has been set to "high," fonts may not load.

All text is italicized in Internet Explorer

Problem Solution
Document mode is set to an older version of the browser.

Using a different document mode will result in the wrong font file format being served to the browser. This can cause all the text to be set in italics in IE, as explained in this blog post.

Remove meta tags that tell IE to use a different document mode, such as
<meta http-equiv="X-UA-Compatible" content="IE=8">

Fonts aren't displaying or look “doubled” in Safari and Mobile Safari

Problem Solution
The font weight or style in the CSS isn't available in the kit. If the specified font weight or style isn't included in your kit, these browsers may try to create it. Make sure that the weight and style you want to apply are included in your kit and that they are specified correctly in the CSS.

This work is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License  Twitter™ and Facebook posts are not covered under the terms of Creative Commons.

Legal Notices   |   Online Privacy Policy