Using Typekit Fonts with Reflow
Using Typekit in your Reflow designs is pretty easy, but you need to follow a couple steps.
Take a quick look at the video and you’ll notice there are only a couple steps you need to take to bring Typekit fonts into your Reflow project.
Step by Step
The Typekit Menu
You can get instructions by rolling over the “?” in the menu. But we’ll go over it all here.
You’ll now need to go to the Typekit website to create a kit, or find one you’ve already created. Access the site by using your Creative Cloud app and going to the fonts section, or just in your browser. For more information on using Typekit, check out this tutorial that has more topics included.
When adding fonts to your kit, be sure to check for fonts that allow “Web Use”. Then add them to a kit.
Once you add the font to a kit, you’ll get the Adobe Typekit Editor where you’ll get the info you need for Reflow.
The next two steps are the important parts:
First we’ll add “localhost” to the Domains allowed by the kit. You can find this under “Kit Settings” in the Editor.
Grab the Kit ID
The Kit ID is what you’ll need to paste back into Reflow to use the fonts you’ve put in your Typekit kit. In the Typekit Editor click the “Embed Code” link and copy the six character ID:
Now make sure to publish your kit!
Back to Reflow…
Switching back to Reflow, now add the Typekit ID into the field for Custom fonts and hit return. Once successful, the field will turn green, and you’ll now have these fonts available in your typeface drop down.
That’s it! Again, the main things to remember when using Typekit fonts:
- • Be sure to add “localhost” to your domains
- • Remember to publish your kit when you make changes
- • Find the Kit ID in the Embed Code and paste it into Reflow