Switch

A control that allows the user to toggle between checked and not checked.

Installation

npx shadcn@latest add https://spoke.georgedrury.co.uk/r/switch

Lineage

Spoke utility classes

ClassFallback chainDescription
--switch-radius9999pxBorder radius for switch
--switch-thumb-radius9999pxBorder radius for thumb
--switch-checkedvar(--primary)Colour for checked switch variant
--switch-uncheckedvar(--input)Colour for unchecked switch variant
--switch-thumbvar(--background)Colour for thumb switch variant
--switch-bordertransparentBorder colour for switch
--shadow-switchvar(--shadow-xs)Box shadow for switch