In case you want users to choose only one option out of a predefined set of mutually exclusive options, use the Radio Button element.
Adding the Radio Button
1. Find the Radio Button element in the toolbar on the left-hand side.
screen
2. Drag-and-drop it into a form.
screen
Formatting the Radio Button
3. To edit the placeholder text, select the Radio Button element and click the Pencil icon in the formatting toolbar.
screen
Tip: You can rename each option, change its color and add icons by editing the text in the formatting toolbar.
4. You will be taken to the Inspector tab, where you can add or remove Radio Button options, change the placeholder text, specify the tag (a piece of information that will be sent into your system once the form is submitted), and mark the form as required.
screen
Customizing the Radio Button
5. For more customization options, you need to explore the Inspector tab.
- In the Attributes section, you can specify the Radio Button's ID and class, align it to the right, left, center of the form, make it visible on smartphones, tablets, laptops, and PCs;
- Change the style of the text under Text Style;
- In the Padding and Margin sections, you can change the layout of the Radio Button;
- You can select a background color, add an image or gradient to it in the Background section;
- You can also add borders and customize the roundness of the Radio Button's edges;
- Add shadows and customize their distance, blur, and spread.
screen