1. Help
  2. Getting started
  3. Make a typeform
  4. Apply a theme to your typeform

Apply a theme to your typeform

You can apply themes from Typeform’s theme gallery to your typeforms. You can also design and manage your own repository of custom themes.

A theme consists of:

  • A color palette with the color values of the main elements of a typeform: questions, answers, buttons, button text, and background.
  • A font for the text.
  • A background image (optional), including brightness and scaling configuration.

Create your own custom themes

To create custom themes, follow these steps:

1. Open your typeform in the Create panel and click on Design in the right-hand sidebar. Under the My themes tab, click + Add new theme.

themes1.png

2. Click on the text box at the top of the sidebar and type in a new value to give your theme a memorable name.

themes2.png

3. Select a font for your theme from the drop-down list. You can learn more about fonts in Typeform here.

themes3.png

4. Now select the color scheme for your theme. You can select separate colors for question text, answer text, buttons, button text, and the typeform background.

Click on the color droplet menu icon and pick a color from the palette or insert a hex value.

themes4.png

5. If you’d like to use a background image instead of a solid-color background, click the Add button next to Background image. There’s more information on adding background images here.

themes5.png

6. Finally, you can set the size and alignment of your text for the Welcome Screen, Endings, and questions:

themes6.png

7. Once you’re happy with your settings, click Save as new theme.

themes7.png

8. You can now access your saved theme and apply it to any typeform by going to the My themes tab. Click a theme to apply it to your typeform.

themes8.png

If you copy or move the typeform to another account, the theme will also be transferred.

Editing, duplicating and deleting your custom themes

Clicking the three-dot icon next to any theme gives you the option to rename, edit, duplicate, or delete your theme.

themes9.png

When editing a custom theme, you’ll need to either save the changes you’ve made or revert back to the original version.

Editing and resaving a custom theme does not create a new copy of the theme. Once you’ve saved edits on a custom theme, you won’t be able to access previous versions of that theme. To save a copy of the original custom theme, duplicate it and make edits on the duplicate version.

Additionally, if you edit a custom theme, this theme will change for all typeforms that use it. We’ll warn you if other typeforms use the theme, and you can choose to proceed with editing or duplicating your theme instead.

Theme gallery

To view the gallery of Typeform-designed themes, click Design in the right-hand sidebar, then the Gallery tab. You’ll see a list of themes and can preview the font and color scheme of each. Click on a theme to apply it to your typeform.

You can edit the font, color scheme, and background image of these themes by clicking the three-dot icon on the theme card. When you save edits on a theme from the gallery, a new custom theme will appear under the My themes tab. A default version of the theme will remain accessible in the Gallery tab.

themes12.png

Themes marked ‘Premium’ can be applied to typeforms on Plus accounts and above.

themes13.png

If you are on a Free or Basic plan, you can test out how Premium themes look on your typeform, but you’ll have to remove the themes before you can publish the form.

If you have a Plus account or above, you can edit Premium themes using the three-dot icon.

 

Tap into our community knowledge

Find Answers
Contact Support