Using our Theme section, you can customize text font, weight, size, color, headings, background images, and more, as well as change the general styling of questions and other UI elements, and even add custom CSS.
You can access the form's Theme in the top bar of the form editor – that water drop icon top right of the editor.
The theme configuration is broken into 4 sections.
1. Theme Settings
Theme settings give you quick access to commonly used theme defaults. You can set default fonts and colors, as well as import the theme from other forms on Pro and Agency.
2. Form Experience
The form experience feature allows you to pick whether your users have a standard form experience, or use our "one-question-at-a-time" guided mode.
Guided mode is our new form experience that allows users to progress through your form with a much simpler approach - presenting one question at a time.
Typography gives you fine-grained control over the font, sizing, line heights, and coloring of text on the form. We support all Google Fonts on all plans, and you can bring in any others you'd like to us using CSS on Agency if that's something you're comfortable adding.
On Pro & Agency, you can create a Custom Style and apply it to any text to make sentences or words pop.
Go to Typography, and choose "Add Custom Style+" option. When you are in the form editor, highlight the words you would like to apply your custom style to. You will see a bar of styling options, choose an arrow on the right – it will give you an option to select your Custom Style.
4. UI Elements
UI Elements gives you specific style controls over different UI elements, from the background to the submit button. Agency users can also add custom CSS to their forms here.
In this section, you can change the background of your form. Go to Theme → UI Elements → Background, and you will see options to change the background color or upload your image. An example of a background image can be found here.
This section gives you control of how your question fields are showing on your form. You can enable the background and shadows of the question boxes or make them transparent.
If you would like to change the wording and the styling of the 'Submit' button, this is a place to create your desired Submit button look.
The Submit Button section contains the ability to;
For Pro and Agency users:
If you want even more control over the look and feel of our form, we offer CSS & HTML on the Agency plan.
You can change the style of your pagination buttons in your Theme Settings (that drop icon top right corner of your editor).
On Essentials and Pro, you can make pagination buttons either look like arrows, numbers, or progress bar.
Go to Theme → UI Elements → Pagination Buttons → Pagination style → and choose your preferred style.
Just about all of the language that is used in the form can be customized using translations. Translations can be shared among forms, and can also be edited in the account settings
For Guided Mode, the pagination buttons work slightly differently. You'll see three options:
Include a back button - This will allow users to return to their previously answered questions. By default, this option is disabled.
Include progress bar - This will add a progress bar to the top of the form window to indicate a user's progress through your form. By default, this option is disabled.
Include page numbers - This will add the total number of pages and current page number to the top right of the form window. By default, this option is disabled.
On Agency, you can use custom CSS to customize the appearance of the buttons or add text, but you need to know how to use CSS or find someone who does.
Custom CSS (Agency only):
CSS (Cascading Style Sheets) is used to control the appearance of just about everything. Custom CSS gives you fine level control over the styling on the page, allowing you to control the coloring, spacing, sizing, and lots more!
Features available on Agency only: