App Builder Form Component
Here is the list of various form components which you can use to add forms to your web pages.
Input
Adds a text-based input field to allow users to type data or information in a form. To add an input field, go to the “Forms” category under the Components panel and drag and drop the "Input" component in the canvas, which looks like this:
Input - Settings
Click this icon, 
to open the settings of an input field.
Here, you can change its font-family, Placeholder text, font-size, colour, background colour etc. as well as can choose the input type such as Number, text, email, password, date or hidden fields.
File Upload Field
Adds the functionality of uploading files in a form to allow users to share files with different format types, such as doc, pdf, image, excel, CSV, zip etc.
To add a file uploading field, go to the “Forms” category under the Components panel and drag and drop the "File" component in the canvas.
Form Group
It is used wherever you want to display the Text Field along with its label. Text Field can be for any purpose such as text, numbers, date, password, email etc. By default, it contains a label and an input box, but you can delete them and add other form components as per your requirement.
To add a Form Group, go to the “Forms” category under the Components panel and drag and drop the "Form Group" component in the canvas.
Input Group
This component allows you to add an input box with a text box and a button on either side.
To add an Input Group go to the “Forms” category under the Components panel and drag and drop the "Input Group" component in the canvas.
Textarea
Adds a multi-line text area in your form to allow users to put their comments or give their reviews without any character or text limit. To add a Textarea field in a form, go to the “Forms” category under the Components panel and drag and drop the "Textarea" component in the canvas.
Textarea - Settings
Click this icon, to open the settings of a textarea field.
Here, you can set the name of the Textarea field and its placeholder name, for example, "Type Your Name Here"
Select (Dropdown List)
This component displays the dropdown list in your form to allow users to select one or more options from the list of options provided by you.
You can also bind a collection to it to add dropdown options from a collection. To add a select field in a form, go to the “Forms” category under the Components panel and drag and drop the "Select" component in the canvas.
Select Field - Settings
Click this icon, to open the settings of a select field.
Here, you can create a dropdown list by adding different options of your choice for end-users to select from.
Checkbox
This component adds a checkbox to allow users to select options by ticking the checkboxes.
To add a checkbox, go to the “Forms” category under the Components panel and drag and drop the "Checkbox" component in the canvas.
Once you place it on the Builder Console, it looks something like below.
Radio Button
This component adds a radio button in a form or any other component to allow the users to choose only one option from the predefined set of options provided by you.
To add a radio button in a form, go to the “Forms” category under the Components panel and drag and drop the "Radio Button" component in the canvas.
Once you place it on the Builder Console, it looks something like below.
Label
This component is used to provide some additional information in a form.
To add a label, go to the “Forms” category under the Components panel and drag and drop the "Label" component in the canvas.
Label - Settings
Click this icon, to open the settings of a label.
Here, you can change the context or background color of a label, as shown below:
Button
This component adds a clickable button to your form.
To add a button, go to the “Forms” category under the Components panel and drag and drop the "Button" component in the canvas.
Button - Settings
Click this icon, to open the settings of a button.
Here, you can change the text inside a button and its functionality.
Styling the Form Components
To style and design a form component, just click on the added component and its Style Manager will open automatically in the Right Toolbar. Here, you can change the background, font, dimensions, etc. of a component and customise it as per your needs.
Additional Tools
All the form components have a set of additional tools, positioned on the right side of each component. Know more.