All Collections
Quizzes
Styling and Branding
Google and Typekit Fonts for Quizzes
Google and Typekit Fonts for Quizzes

How to enable Google or Typekit fonts to make your quiz unique.

Jared Cooperstein avatar
Written by Jared Cooperstein
Updated over a week ago

A quiz should feel unique. That's why Interact supports 679 typefaces from Google Fonts as well as thousands more you can connect from your Adobe Typekit account.

First, let's walk through how to select a typeface from Google Fonts. Afterwards, we will select a different font provider, such as Adobe Typekit.

How to use Google Fonts:

To change the font of your quiz, while editing a quiz in the builder, click on the "T" icon and then select the "QUIZ TEXT" drop down.

A font picker window should now appear. Click on any font to preview the style on your quiz. You just successfully configured your quiz with a Google font!

Selecting fonts from other providers:

If you would like to use an alternative to Google Fonts, click "Select Provider" to list other ways of selecting a font for your quiz.

Currently, Interact supports Adobe Typekit, Google Fonts, Classic Fonts (Browser/Web Safe), as well as our Default Font, Proxima Nova.

How to use Adobe Typekit:

After clicking Adobe Typekit from the list of providers, let's configure it. There are three steps to enabling a Typekit webfont:

  1. Copying Typekit ID from Typekit.com and pasting into the ID field below.

  2. Copying Font Family name from the kit and pasting into the field below.

  3. Adding *.tryinteract.com to the kit's 'Domains' list within 'Kit Settings'

  1. After creating a "kit" on Typekit, you will have to locate the Typekit ID or 'Kit ID'. It is usually a 6 or 7 digit code. Paste this into the Interact Quiz Builder Font Picker. Then click on "Kit Editor" for that kit.

2. Locate the Font Family name you would like to use in the Quiz. For this example we are using 'Gastromond'. Paste this Font Family name into the Interact Quiz Builder Font Picker as well. Then click 'Kit Settings' in the upper right corner.

3. After clicking 'Kit Settings' please add *.tryinteract.com as a domain within the 'Domains' field. This allows your quiz to properly load and display your Typekit font.


After ensuring those three steps are complete, confirm the Typekit ID, Font Family, and whitelisted Domains are correct, then click 'Publish' to update the settings for Typekit.


Now click 'Save' back in the Interact Quiz Builder Font Picker. You should now see a preview of your Typekit typeface as the font style of your quiz.
โ€‹

Did this answer your question?