How to use the Heading Styles tab
The Heading Styles tab allows you to customize the appearance of headings across your forms. This helps create a consistent, readable, and professional appearance throughout your content. You may want to create a few heading styles – one for main headings and one for sub-headings, and so on.
You can configure the following visual settings:
-
Font Style – Apply bold, italic, or underline effects to your headings.
-
Text Alignment – Align headings to the left, center, or right.
-
Label Color – Choose the color for your heading text or background.
-
Text Case – Set headings to display in all caps, lowercase, or sentence case.
-
Padding (Spacing) – Adjust the top and bottom padding to control the space around each heading.
As you make changes, the Heading Style Preview updates in real time, allowing you to see exactly how your heading will appear before saving.
These tools give you full control over the presentation of form headings, supporting better structure and visual clarity across your forms.
- From the Configuration menu, click Visual Settings to open the Themes, Styles, and Templates page.
- Click Headings to open the Heading Styles tab.
- Click + New Style to create a new heading style.
- In the Heading Style Name field, enter a name for the heading style. Each style name must be unique within the style category. For example, you can have only one Heading named Corporate, but you can use the name Corporate again in other style categories.
- Toggle Allow form-level changes to this style if you want form designers to be able to change headings with this style when designing the form. When a template is applied, this option allows you to enforce or adjust style rules per form. You can create as many as you think you'll need and leave them unchangeable to enforce a consistent appearance across your forms.
- Configure the default visual settings for the heading. From the Size list, select the label size: Extra Large, Large, Medium, Small, or Extra Small. Specify whether the heading text should be Bold, Italic, and/or Underline. Choose the text alignment: Left, Center, or Right. Finally, use the palette to select a label color.
- Toggle Use color as background color to use the selected color as the background. Turn this toggle on and off and look at the preview to determine how you prefer this setting.
- Toggle Force all caps to display the heading text in uppercase.
- Toggle Collapsible to allow the app user to expand and collapse the information between headers when completing the form.
- Headings are always 4 columns in the designer and app. You can add top and bottom padding to your headings to control the amount of space around them. This spacing helps visually separate different sections, areas, or topics within your form, making it easier for users to read and understand the content.
- Click Save to save the heading style.
- If you no longer use a heading, it can be deleted. If you delete a heading and it is part of a template it is removed from that template and from the forms that are assigned that template.