New Form Styling Options – thedatabank Support Center

The July 2020 update to forms includes some advanced styling capabilities that can help you match the look and feel of your forms to the look and feel of your web site.

The Properties tab in the Form Builder has a new section called Styles, which gives you some control over how your form will look. The Styles are all considered advanced options, so you'll need to click the Advanced Options toggle to "On" at the top of the page in order to see them.

Once you've done that, you'll need to scroll about halfway down the page to get to the Styles section:

Prompt Label Placement. Labels can be inside the input boxes, or above them. Inside is the default and has a "cool" factor, as you can see on this sample donation page, but on some forms it may look better if all inputs have the label above the input box. There is no option to have labels to the left.

Text Size. You can choose a text size that closely matches your web site's text size, but keep in mind what devices your visitors will be using when they fill out your forms. Larger sizes are better for fingers and thumbs on mobile devices; smaller sizes work better with a mouse on a laptop or desktop. Sometimes it's better to choose a size for usability rather than to match your web site.

Highlight Color and Highlight Text Color. These colors are used on buttons, column headers, calendars, etc., wherever a splash of color is needed to highlight something in the form. Lighter shades of this color will be used in different places. For instance, buttons use the Highlight Color, but when a mouse hovers over the button, it turns to a lighter shade. Because lighter shades of the Highlight Color are used in places, the Highlight Color itself should be a dark shade.

Cart Text Color. The default cart text color is lighter than other form text, to de-emphasize its content vs. the data entry content. This color is also used on calendars.

As you choose colors and text size, a sample cart display is updated to give you an idea of how your choices will look in your form.