Right sidebar in the form and survey builder

The Right Sidebar is the form and survey builder's control panel for visual and layout settings, with three tabs: Styles, Themes, and Advanced. Open it from inside the Form or Survey builder by clicking Styles & Options in the upper-right corner; click it again to collapse the sidebar.

Open the Right Sidebar

Click Styles & Options in the upper-right corner of the Form or Survey builder to open the sidebar, and click it again to collapse it. The sidebar holds three tabs:

• Styles — fine-tune the form or survey layout and appearance.

• Themes — apply ready-made presets for consistent branding.

• Advanced — additional options for specialized needs.

Styles tab

The Styles tab fine-tunes the layout and appearance of the form or survey. Changes update live in the preview, and the tab is organized into these control groups:

• Layout — the overall arrangement and field presentation, including how inputs and labels appear, plus widths, spacing, padding, and the top margin above the form or survey. Top-margin controls adjust space without requiring Custom CSS. Leaving margin fields blank preserves the default spacing.

• Top and Bottom padding — can be set to 0 px for a true edge-to-edge layout.

• Footer (Surveys) — controls footer content and appearance for surveys.

• Colors & Background — font settings, background colors, and, where supported, background or header imagery.

• Miscellaneous — applies organization-level branding or turns it off.

Themes tab

The Themes tab offers ready-made presets for consistent branding. Apply a theme by hovering over it, selecting Use Theme, then clicking Proceed in the pop-up.

Switching themes results in the loss of the current style modifications. To test another theme without permanently losing the current look, apply the new theme, then use the Back button in the upper-right corner of the builder to revert.

Button styling panel

The Button styling panel centralizes button appearance controls. Open a form in the builder, click the button element on the canvas, and in the right sidebar expand Button, or use Styles > Button.

1. Click Select Themes and browse the categories: Filled, Border, Text Only.

2. Hover over or select a theme to preview changes live on the canvas.

3. Click Apply.

The panel then exposes these customization controls:

• Colors & Background — text color, background color, border color.

• Typography — font family, font weight, size, letter spacing, and text transform; custom fonts are supported.

• Layout & Alignment — Left, Center, Right, and a Full Width toggle to span the container.

• Padding — top/bottom and left/right; values can be linked or unlinked.

• Border & Corner Radius — border width, border style, and corner radius for rounded or square buttons.

• Shadow — enable, then adjust blur, distance, and spread.

Click Reset or Revert to undo style changes, or reopen Select Themes to choose a different starting point.

Advanced tab

The Advanced tab holds additional options for specialized needs, grouped by element:

• Form — form-container borders, corners, and shadow.

• Input Field — text color, focus color, borders, corners, width, padding, and shadows.

• Label — label typography and color.

• Short Label — short-label typography and color.

• Placeholder — placeholder text appearance.

• Custom CSS — precise styling control. Custom CSS takes precedence over Styles and Themes and may impact theme styling.

Element-level label alignment

Element-level label alignment sets a different label position for each field instead of one global alignment. It is available in Forms, Surveys, and Quizzes, but only for forms using the Single Column layout, and it applies to standard fields such as text inputs, drop downs, radios, and other standard fields.

1. In the Form or Survey Builder, select a single field.

2. In the right sidebar that pops up, locate Label Alignment.

3. Select the desired alignment with the arrows: Top, Left, Right, or Form Default.

Existing forms retain their global alignment unless a field is explicitly updated. On mobile, alignment automatically defaults to Top regardless of desktop settings.

Switching to Two Column or Single Line removes per-field label-alignment control and returns labels to the default setting. If global label alignment changes, fields set to Form Default update automatically, while fields explicitly set to Left, Right, or Top retain their per-field choice.

Notes

• Changes in the Right Sidebar do not save automatically — click Save in the builder.

• Applying a new theme can reset parts of the visual style, so recheck Styles after switching.

• Custom CSS continues to override Themes and Styles, so review CSS for conflicts.