UI MarCom 3

Toggle Switch Stable Dark theme

A Toggle Switch is similar to a Checkbox for managing settings, for example, in forms or filters. They are used for on/off selection.

<uimc-toggle-switch>
</uimc-toggle-switch>

AttributeDescriptionValuesDefault
sizeChoose the appearance size of the elementnormal, largenormal
checkedReflects the current state of the switch
themeSet the color scheme of the componentlight, darklight

CallbackArgumentDescription
onChangeObjectCallback function that gets triggered when the togglebutton is clicked

SlotSlotted content
defaultInner text is shown as label

Toggle Switch w/o label

<uimc-toggle-switch>
</uimc-toggle-switch>

Toggle Switch w/ label

Label
<uimc-toggle-switch>
  Label
</uimc-toggle-switch>

Large Toggle Switch

Label
<uimc-toggle-switch size="large">
  Label
</uimc-toggle-switch>

Dark theme

Label
<uimc-toggle-switch theme="dark">
  Label
</uimc-toggle-switch>