This is a collection of 10 best JavaScript and/or CSS libraries that transform the normal checkboxes, radio buttons or even any elements into switch-style toggle buttons for better user experience.
Originally Published Jan 13 2018, updated Mar 05 2022
See also:
1. Realistic iOS Switch In Pure CSS
Switchery is a simple jQuery Vanilla JavaScript plugin that converts the standard Html checkboxes into flat iOS style toggle switches with nice sliding effects.
2. Custom Switch
Custom Switch is a pure CSS extension for the Bootstrap 4 framework that converts the regular checkboxes into iOS style toggle buttons (switches).
3. el-checkbox
A pure CSS/CSS3 library to create custom checkboxes, radio buttons, and iOS-style toggle switches.
4. CSS3 Only iOS Switch Button
Yet another CSS/CSS3 solution to creating an iOS-style switch toggle button animated with CSS3 transforms and transitions.
5. Creating Accessible Switch Controls with Pure CSS
A minimal CSS (SCSS) library used to convert the standard radio buttons into accessible, nice-looking switch controls using CSS3 transitions and 3D transforms.
6. vc-toggle-switch.css
The vc-toggle-switch.css transforms the standard checkbox into an iOS-style toggle switch with a gooey effect on switch handle.
7. Toggle Switchy
A minimal CSS (SCSS) library used to convert the standard radio buttons into accessible, nice-looking switch controls using CSS3 transitions and 3D transforms.
8. Material and iOS Inspired Toggle Switch With CSS/SCSS
A customizable, nice clean, iOS- and Google Material Design-style toggle switch library created using pure CSS/SCSS.
9. Switch.js
Just another JavaScript plugin used for creating customizable, CSS3 animated, iOS-style on/off toggle switches from regular checkbox inputs.
10. TiTatoggle
TiTatoggle is a CSS extension to the Bootstrap framework that converts the regular checkbox inputs into different types of toggle switches.
