Components/Switch
Since 1.0.0BETA

Switch

Tactile toggles with state feedback

This page was migrated by AI, please review carefully

Migration is complete, but please validate against source code and manual review.

Switch

Tactile toggles with clear state color and movement.
Status: Beta

Basic Usage

EXAMPLE.VUE
<template>
  <TuffSwitch v-model="enabled" />
  <TuffSwitch v-model="enabled" size="small" />
</template>

Demo

Toggle State

Movement and color change together.

Demo loads on client.

States

PropertyTypeDefaultDescription
disabled--Disabled state
loading--Loading state
sizesmallmediumlarge-Size variants

API (Lite)

PropertyTypeDefaultDescription
modelValueSwitch value
sizesmallmediumlargeSize
disabledDisabled state

Design Notes

  • Movement and color should sync.
  • Use smaller size for dense lists, larger for settings.

Composite Patterns

Settings Row

Switch paired with labels.

Demo loads on client.
Was this helpful?