Web fonts from Adobe Fonts are now available for HTML5 Canvas documents in Adobe Animate.
With the integration of Adobe Fonts with Animate, 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 Adobe Fonts library with any level of Creative Cloud plan, and if you have subscribed to a paid plan, you will have access to the full library with thousands of fonts.
For more information on subscription plans for Adobe Fonts, see Web Font hosting with Adobe Fonts.
Unlike self-hosted web fonts, Adobe Fonts hosts the fonts that you decide to use in your hosted content. If you select fonts from the Adobe Fonts library and then publish your document on the web, Adobe Fonts automatically hosts those fonts and connects your Adobe Fonts account to your content on the web.
The Adobe Fonts library is available to you with your Creative Cloud subscription. For more information, see https://fonts.adobe.com. You can also buy new Adobe Fonts. Re-launch Animate to view the purchased fonts in the All Fonts tab of the Adobe Fonts screen.
The Add Adobe Fonts dialog lists all the Adobe 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 web fonts based on their classifications, such as Serif, Sans Serif and Script.
- Recommended for: Filter fonts based on web fonts' 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 Adobe Fonts 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 Adobe Fonts 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.