If you're using in5 3.3.6 or higher, in5 will automatically generate Typekit-friendly font family names.


If you're using an earlier version of in5, you'll need to use the workaround below to make the exported font family names match those that TypeKit generates.


There are two ways to do this:

  1. Modify the font family names in the assets/css/pages.css file that in5 generates, or
  2. Download the TypeKit CSS, modify the family names, and attach that local copy instead of the live URL.


Here are the steps for the latter method.


Paste the TypeKit URL into your browser and choose File > Save As (you might want to save it in the same folder with your InDesign document).


Open the CSS file in a text editor (e.g., BBEdit, Notepad++, or Dreamweaver).


Do a find and replace. Replace the name in the the TypeKit CSS with the name of the font family as it appears in InDesign.


heading font family replacement


body font family replacement


Use Replace All to change all instances and save your updated file.


Now go back to InDesign and re-export your document (in5 > Export HTML5 with in5).


This time, in the Resources section, you can delete the URL, and add the local CSS file that you just modified.


local modified css


Then click OK to export with the new CSS.