How do I add a custom font from Typekit?

This article explains how to add custom Typekit fonts to your Homerun account. Is your font hosted by a different type foundry? Please click here!

Connecting your type foundry account to Homerun requires some technical knowhow, if you’re not that tech savvy, just ask a colleague to help you out.

Let’s get started
Login to your Homerun account, go to Company Settings and click 'Appearance'. When you click ‘Add custom font’ this window pops up:

image

You only have to complete the above four steps to add your custom font. We’ll take you through each one, step by step.

Adding a Typekit font to Homerun

  1. First, make sure you click Typekit in the first step, the font provider.
  2. In the name field, fill in the name of the font you want to add.
  3. Log into your Typekit account and click Kits at the top right, below your account.
  4. Open the kit of your choice by opening the kit editor.
  5. In the kit editor, click kit settings at the top right, and paste the domains you copied in step 2.
  6. Go back to Homerun and enter the name of the font in the correct field.
  7. Switch to your Typekit account. Still in your Typekit Editor, click on Embed Code at the top right corner. Copy the blue Typekit Kit ID code, switch back to Homerun and paste it in the 3. Typekit Kit ID field. Don’t see an ID? Click on ‘Show Advanced’.
  8. When you switch back to your Typekit Editor, go to Using fonts in CSS, located in the left column. From the first field, copy the “font-family-name” in between the quotes. Go back to Homerun and paste the font family name in the field next to 4. Font Family and click save.
  9. Good job! Your font will now show up in the font-list in Homerun’s job editor. You can add more fonts by repeating the above steps.

Custom font extra options
We want you to have full control over your custom fonts. Hover over a custom font in the fonts-list and you’ll notice settings icon. This allows you to change the following font specifics: font size, font weight and line height.

Was this article helpful?

Can't find what you need?

Lieveke and the team are here to help. Chat with us.