The <FormToggle> component provides a convenient way for a user to make a UI binary decision, similar to a Checkbox, however, the UI presentation and interaction resembles that of a typical iOS UI selection.
A Toggle's common usage is within a Form, however, it can be used stand-alone if desired. For ease, the toggle switch component is attached to and accessible through the Form component (e.g. <Form.Switch // implementation />).
The default switch presentation and behavior is simple and, when toggled on, inherits the dark form style from the default theme. In most cases, it'll be more effective with a corresponding label prop defined.
With a label prop
Toggled on by default
By passing the toggled prop, your form switch will be on by default.
As noted above, a toggle switch is anticipated to be used with a Form component and related sibling components although it's not necessarily required. Here is a basic example of the toggle switch with some relatives, if you will.
Toggle (switch) components get BACKGROUNDBORDER, COMMON, LAYOUT and TYPOGRAPHY system props. Related, children components get similar props, but can have their own, distinct system props. Read the System Props doc page for a full list of available props.
Give your toggle switch an accompanying label text. Recommended.
Form name to associate the toggle switch instance to
Size of the toggle switch. Select from small, medium, large, xlarge, jumbo
Change the switch to a more rounded look-n-feel switch
Change the switch to a square look-n-feel switch
Change a toggle switch's color palette. Select from gray, purple, red and many other of the default theme's formStyles
If defined, will enable the toggle switch to be in the on state by default