Form Theme

Form themes are a great way of making your form fit within your wider branding.

Form themes

Form themes are a great way of making your form fit within your wider branding. It is especially useful if you are embedding a form on your website, sending out forms to customers or data capturing at events. You can customize your web themes in many ways ranging from; changing your header image, a wide range of fonts and a wide colour palette to choose from. 

How To Create Form Themes

If you’d like to design your own form theme, hover over the green plus button in the top left corner of the theme manager, the green plus button it will spin and give you two options. Select > Form Theme.

To give your Form Theme a name, click the 'Name' button which is located at the top left corner of the creation page. 

You’ll then see a variety of fields on the right-hand side:

Background Image — This image displays as a pattern behind your form, similar to a screensaver on your computer. We recommend avoiding attention-grabbing patterns. Solid colors or your company’s logo work well here, or alternatively, leave it empty for a transparent look when embedding onto your website.

Header Image — This image displays above the top of your form and is a great place to include a banner image.

Input Text Header Font

Input Text Body Font

Background Color — This color will only appear if you do not have a background image set.

Field Background — The color that fills the input field.

Field Text — The color of the text that appears in each input field.
Field Border — The outline color of your input fields.

Primary Text Color — The color of your field headers.

Second Text Color — The color of nested text elements, including radial sliders and star rating icons.

Button Background — The main color of any buttons, including calendar and form submission buttons.

Button Text Color — The color of any text and icons that appear within a button.

When you’re finished, be sure to save your work by clicking the done button at the top of the page.

To make your theme live, slide the Public slider to the right until it is green in the top right corner next to Done. 

How To Apply Form Themes

Now that you’ve got a form theme that matches your brand guidelines, it’s time to apply it to your forms. To do so, go back to the Form builder and select the paint bucket tool in the bottom right-hand side. 

 

New Theme Loaction

​​

This will launch a drop-down list of all the themes you’ve created, as well as a larger list including the Array default templates. Simply select the theme you’d like to apply, and save the updates to the form.

If you don't feel like creating your own form theme, you can always visit Array Marketplace and download one of our beautiful ready-made themes for free