Switches

The v-switch component provides users the ability to choose between two distinct values. These are very similar to a toggle, or on/off switch, though aesthetically different than a checkbox.

Usage

A v-switch in its simplest form provides a toggle between 2 values.

API

Component	Description
v-switch	Primary Component

Examples

Props

Colors

Switches can be colored by using any of the builtin colors and contextual names using the color prop.

Inset

You can make switch render in inset mode.

Model as array

Multiple v-switch's can share the same v-model by using an array.

Custom true/false values

The switch can use custom values for its v-model, using the props true-value and false-value.

States

v-switch can have different states such as default, disabled, and loading.

Slots

Label

If you need to render a switch label with more complex markup than plain text, you can use the label slot.