1. What does the element do?
- It is used for the selection of exactly one option from several.
2. When should the element be used?
- When there are two or more options and the options mutually exclude one another.
- There must be a choice of at least two options.
- A pre-selection is mandatory.
- Radio buttons can be arranged vertically or horizontally. The vertical layout is preferred as it allows the user to understand the options more quickly.
- Horizontal layout only for two to three options and short names.
- The text can be multi-line.
- As well as the actual radio button, the entire text also serves as a click target.
4. Variants and statuses
The element has the following statuses:
- Disabled checked
- Disabled unchecked
The element has the following variants:
- with icon / without icon
- listed / boxed
- without icon / with icon
- without subtext / with subtext
- without button / with button