Form Preview navigation bar, press
Design Form button, it opens the form designer sidebar. With form designer, you can easily customise your form’s look and feel.
Your change is reflecting to form preview immediately if your form has corresponding widgets. Only when you explicitly click
Apply button, the changes are saved. Also, only when you publish this form (again), the new look-and-feel will be exposed to public users. You can
Revert your change to last save state or
Reset to default to restore to our default look and feel.
In form designer second tab, you can paste your CSS styles into that text box. Likewise, this CSS only apply to the new form when you publish the form (again). These styles have higher priority and will overwrite those default styles.
|Form Width||Adjust the form width, in
|Label Layout||4 options, Customise, Vertical, Horizontal or Hide; Customise means each label may have a different layout which is controlled by its properties dialogue in builder page.|
|Font||Font for all text in your form, e.g, label, heading, descriptions, input text, button text etc.|
|Font Size||Font size label. Our form designer will automatically adjust other text font size, e.g, heading, help text and button text size etc.|
|Line Spacing||Spacing between lines|
|Label Width||Only when your label layout is
|Navigation bar||When your form has
|ReCaptcha||It is a Google widget with limited customisation options. You only can choose a light or dark theme for it.|
|Label Colour||Label Colour. Our form designer also adjusts help text colour accordingly.|
|Input Colour||Input text colour. Our form designer also adjusts its border and placeholder text colour accordingly.|
|Button Colour||Button background colour. Our form designer also adjusts its border and button text colour accordingly.|
|Highlight Colour||It is for input box border colour when it is getting focus. It is the colour of the navigation bar active item. It is also the
|Background Colour||The page background colour.|
|Signature Colour||The signature background colour. Our form designer also adjusts its border, button and help text colour accordingly.|
|Navbar Colour||Navigation bar background colour. Our form designer also adjusts its border and text colour accordingly.|
|Error Colour||Error message text colour and input box border colour if it has an error.|