Adobe Typekit web fonts are now available for HTML5 Canvas documents in Adobe Animate CC.
With the integration of Typekit with Animate CC, thousands of premium web fonts from quality foundries are instantly available to you in your HTML5 Canvas documents.
You can try a limited selection of fonts from the Typekit library with any level of Creative Cloud plan, and if you’ve subscribed to a paid plan, you’ll have access to the full library with thousands of fonts.
For more information on subscription plans for Typekit, see Web Font Hosting Plans from Typekit.
Unlike self-hosted web fonts, Typekit hosts the fonts that you decide to use in your hosted content. If you select fonts from the Typekit library and then publish your document on the web, Typekit automatically hosts those fonts and connects your Typekit account to your content on the web.
The Typekit library is available to you with your Creative Cloud subscription. For more information, see https://typekit.com/.
You can also buy new Typekit fonts from the Typekit marketplace. Re-launch Animate CC to view the purchased fonts in the All Fonts tab of the Typekit font screen.
The Web fonts dialog lists all the Typekit web fonts that are available to your Creative Cloud subscription plan. You can now select the font that best suits your design needs by browsing through fonts, searching for specific fonts, or filtering by font properties.
Click Filter to take advantage of any of the following Filters:
- Classification: You can filter Typekit fonts based on their classifications, such as Serif, Sans Serif and Script.
- Recommended for: Filter fonts based on Typekit's recommendations for paragraph or headings.
- Properties: Filter based on properties such as weight, width, and height.
Once you find a font that you want to use, simply click on it. A check mark appears indicating the font is selected. You can choose multiple fonts to add at once. The Selected Fonts tab displays all the fonts that you've selected.
You can click the font preview footer to see all the variations, such as thin, bold, and italic.
Before publishing your content on the Web, open Publish Settings, click the Web fonts tab, and specify the URL of the page on which your HTML5 content will be hosted. For example, www.adobe.com. You can also specify multiple URLs separated by comma.
- The web fonts from Typekit will only load on domain names that are listed in the publish settings. If the fonts don’t work or you see a 403 error from Typekit on your webpage, make sure you have included the website domain in that list and republish the project.
- "Output generated via the TestMovie option is meant for preview only. Use the File > Publish option to generate the output for final deployment.