Styling Your Form
Make your form match your organization's branding with the Form Style settings. You can customize colors for fields, buttons, and labels — or apply your brand kit to set everything at once.
To access styling options, open your form in the Form Designer, click the Settings tab, then select Form Style from the left sidebar.
Applying a Brand Kit
If your organization has a brand kit set up in BetterUnite, you can use it to auto-fill your form's colors in one click.
- Under Apply Brand Kit, select your brand kit from the dropdown.
- Click the Apply button.
- Your brand colors will be applied across the form's fields, button, and labels. You can still fine-tune individual values afterward.
Use the refresh icon next to the dropdown to reload available brand kits if you've recently created or updated one.
Field Styling
Under the Fields section, you can customize three colors:
- Text Color — The color of text that users type into form fields. Default:
#000000(black). - Background Color — The background color of the input fields. Default:
#ffffff(white). - Border Color — The outline color around each field. Default:
#dddddd(light gray).
Click on any color swatch to open a color picker, or type a hex color code directly into the text field.
Submit Button Styling
Under the Submit Button section, you can control the button's appearance:
- Text Color — The color of the text on the button. Default:
#ffffff(white). - Background Color — The button's background color. Default:
#3aaee0(blue). - Width — Choose between Full width (100%) so the button stretches across the form, or a narrower option.
- Alignment — Position the button to the Left, Center, or Right of the form.
Label Styling
Under the Labels section, you can adjust how field labels appear:
- Text Color — The color of the label text above each field. Default:
#000000(black). - Alignment — Choose Left, Center, or Right alignment for your labels.
- Font Style — Toggle Bold and/or Italic on or off.
Style Preview
At the bottom of the Form Style page, a Style Preview shows a live example of how your form will look with the current settings. This includes a sample label, a sample input field, and the submit button — so you can see your changes in real time before saving.
When you're happy with the look, click Save Form to apply your styling changes.