Liquid Switch

Installation

npx shadcn@latest add https://liquidcomponents.xyz/r/liquid-switch.json

Usage

import { LiquidSwitch } from "@/components/ui/liquid-switch"

export function AutomaticUpdates() {
  return <LiquidSwitch defaultChecked aria-label="Automatic updates" />
}

The component supports controlled and uncontrolled state, keyboard activation, pointer dragging, form integration, custom tint, three sizes, and a truly non-interactive disabled state.