How to Style a Form

You can style your form by applying a premade theme or modifying your form by editing the formatting options. To learn how, please follow the steps below.

To access the Themes and Styles page, click the Forms module and then click the form you would like to edit. On the editing page, click the Themes & Styles icon in the middle on the bottom menu bar.

How to Access the Form Themes & Styles Page

Apply a Theme

To apply a theme, click the paintbrush icon. Select a theme to apply it on your form. This will automatically save.

How to Edit the Colours & Background On Your Form

Click the colours icon. You can select premade colour schemes by selecting one of the squares that appear on the top of the right panel. If you would like to edit the colours of the form, you can enter the hex code for sections such as font colour.

Here is what each area changes:

Page Image - The changes the background image outside the form box.
Form Image - This changes the background image within the form box.
Page Colour - This changes the background colour outside the form box.
Form Colour - This changes the background colour within the form box.
Font Colour - This changes the text colour of the question field text. As an example, on the image above, this would change the text for First Name, Last Name, and Email.
Input Colour - This changes the colours of the question field boxes.
Input Text Colour - This changes the text colour of the text that is entered for the question fields.
Button Styles - This option allows you to change the colour and style of the button on the form.

How to Modify The Form Button Style

1. Click the button styles dropdown on the colours tab.

2. Click a premade button style. You can also select a button size or customize your button further. Here is what the customizable areas changes:

Padding X - This changes the width of the button
Padding Y - This changes the height of the button
Button Colour - This changes the colour of the button
Border Radius - The changes the rounded edges that appear on the button. If “0” is entered, the button will be fully rectangular with no rounded edges.