A polished toggle set for binary actions with clear contextual feedback. Variants include compact iOS/Material switches, labeled “Off/On” controls, and action cards (e.g., Add to Favorites → Added to Favorites with icon swap). Transitions are smooth and haptic-enabled; states are accessible, localizable, and designed for production forms and settings.
Functionality
-
Tap/drag interaction with spring-physics thumb, ripple, and optional haptic confirmation
-
Visual states: off/on, hover, focus, pressed, disabled, async loading (guard + spinner)
-
Context cards: dynamic text + icon change (outline → filled heart), optional toast/snackbar
-
Labels (left/right), badges inside the thumb, and density presets (compact/regular)
-
Theme variants: solid, outline, soft/neo shadow, gradient pill; light/dark ready
-
Form bindings: controlled/uncontrolled, validation,
onChanged
, optimistic update with rollback -
Accessibility: ARIA
switch
, screen-reader labels, Tab/Space/Enter keys, RTL & Reduce Motion support -
Performance tuned for lists (layer caching, 60fps)
Use cases
-
Favorites/likes, subscriptions, save-for-later
-
App settings (notifications, privacy, biometrics, dark mode)
-
E-commerce quick toggles (stock alerts, auto-reorder)
-
Admin/ops feature flags and access controls
-
Media/streaming (autoplay, downloads on cellular)
-
Smart-home scenes and device power switches
Keywords
toggle switch, on/off control, labeled switch, favorites toggle, heart icon, optimistic UI, async guard, haptic feedback, ripple, gradient pill, neumorphic, outline style, accessibility, ARIA switch, keyboard navigation, RTL, reduce motion, theming tokens, dark mode, responsive UI, Flutter widget, FlutterFlow component, high performance.