Styling forms

Select a Form widget and open its Style tab. Form-specific sections come first, followed by the standard Background, Spacing and Border sections every widget has.

Colours

• Accent Colors — Accent color drives buttons, selected choices, checkboxes and the progress bar; Accent hover (auto-darkened if left empty) and Accent text set the rest.
• Label color — the colour of questions and labels. Set this when the form sits on a dark background.
• Input Colors — background, border, text and placeholder colours for every input. Dropdown lists and pop-ups follow these colours too, so a list always matches the field it opens from.

Putting a form on a coloured background

The form itself is transparent, so it takes on whatever is behind it. To give a form a background, set it on the Form widget's Background section or on the Container around it, then set Label color to something readable. Inputs and dropdowns keep their own solid background (white by default) — change them under Input Colors if you want dark fields too.

Layout

• Form Layout → Border radius sets the form's corner rounding.
• Form Layout → Spacing unit scales the gaps between fields — smaller for compact forms, larger for airy ones.

Navigation buttons

• Alignment — Left, Center, Right, or Back left, Next right (Back on the left edge, Next / Submit on the right).
• Icons — an optional dashicon or custom SVG for the Back, Next and Submit buttons, placed before or after the text, with its own size.
• The Button sub-section styles all three buttons' typography, colours, alignment and spacing, with a separate hover state.

Labels and inputs

The Question Label and Input Field sub-sections give typography, colour and spacing control over every label and every input in the form at once.