Skip to content
FormBrowse form components
ComponentsFormStable

Switch

Native checkbox styled as iOS-style switch with gradient when checked.

Live preview

Usage

Adapters:React stableVue stable
index.html
<input class="lm-switch" type="checkbox" aria-label="Enable SSO" />

CSS classes (2)

ClassDescription
lm-switchNative checkbox styled as switch
lm-switch-{size}sm | md | lg

React props (1)

PropTypeDefaultDescription
sizeSizemd

Accessibility

  • Every control needs a visible <label> or aria-label.
  • Use aria-describedby to link hints and error messages.
  • Never rely on color alone for invalid state — pair with text + icon.
  • Required fields use aria-required and an inline marker.

Spotted something wrong? Edit this entry on GitHub.