Tailoring your form's design helps create a seamless experience that fits your brand. The Styles Tab in the form builder gives you a wide range of options to adjust the visual aspects of your form, including layout, colours, and advanced design elements, so your form looks great and works well.
To access the Styles tab, click the "control" icon at the top right corner of the form builder.
Layout
Here you'll find your form layout settings, which control how fields are spread across the form.
Show Image
Enabling this option lets you add an image to your form.
Once you've added your image, you can adjust its placement and dimensions.
Form Type
The form type controls the orientation of your fields. There are three options:
- Single Column: A vertically streamlined version of the form; all fields will have a width of 100%
- Two Column: Breaks your fields into two columns, split 50/50 by default.
- Single Line: Fits as many fields as possible into a single horizontal line, giving you the most control over how many fields appear and how wide they are.
Input Style
Adjust how the input fields look to improve readability and appearance.
Width
Control how wide the form appears by entering a numerical value. Larger numbers result in a broader form.
Field Spacing
Set the distance between fields by specifying a value, keeping them well-spaced for a clean look.
Label Width
Specify the width of the field labels for consistent alignment.
Label Alignment
Align field labels to the left, centre, or right based on your design preference.
Padding
Add spacing around the form's edges to ensure elements aren't too close to the margins. Enter values for top, bottom, left, or right padding to customise.
Show Label
Toggle this option to hide or display field labels. Disabling it gives the form a minimalist look.
Colors & Background
Click the dropdown to configure the Colors & Background of the form.
Background
Change the form's background colour by selecting from the palette or entering a custom hex code. This affects the general form background.
Font Color
This changes the colour of user responses as they're entered. You can preview it by using the form preview.
Input Background
This changes the background colour for the response fields.
Background Image
The background image covers the entire page, providing a visual backdrop for the form.
Header Image
The header image spans the full width of the form and sits at the top.
Miscellaneous
Click the dropdown to configure the Agency branding within the form.
Agency Branding
In the Miscellaneous section, toggle the company Branding option on or off to show or remove agency branding at the bottom of your form. Turning it off allows you to place your form on a different funnel from the agency's.
The Styles Tab in the form builder lets you create forms that are both functional and visually appealing. By customising layouts, colours, and other options, you can build forms that suit your needs and fit your brand.