10 Best Toggle Button Plugins In JavaScript & CSS (2024 Update)

Looking for a toggle button component to toggle something on the page just like using native checkboxes or radio buttons?

If you like our 10 Best Toggle Switches In JavaScript & Pure CSS, you might also be interested in this list of 10 best Vanilla JavaScript and jQuery Plugins for creating custom toggle buttons that enable the user to make a choice between two or more states (such as on/off) on the page. Have fun with it.

Originally Published Oct 11 2021, updated Mar 06 2024

Table of contents:

• jQuery Toggle Button Plugins
• Vanilla JavaScript Toggle Button Plugins
• CSS Only Toggle Buttons

jQuery Toggle Button Plugins:

Nice Checkbox And Radio Button Replacement Plugin - nicelabel.js

nicelabel.js is a tiny jQuery plugin that converts the default checkboxes and radio buttons into nice toggleable switches and/or selectable labels.

[Demo] [Download]

---

Single & Multi-state Toggle Buttons In jQuery - Toggle.js

A jQuery based toggle button builder that converts buttons, checkboxes, radio buttons, or select boxes into user-friendly single- or multi-state toggle buttons with custom on/off icons.

[Demo] [Download]

---

Transform Select Boxes Into Toggle Buttons - jQuery numberselector

A jQuery plugin that converts the regular select box into a horizontal picker bar containing inline toggle buttons for a better user experience.

[Demo] [Download]

---

Customizable Lable-style Radio Buttons - jQuery Radiocharm

A jQuery plugin to enhance & beautify the regular radio button that allows custom labels, icons, styles for each status of (un)checked inputs.

[Demo] [Download]

---

Create On/Off Toggle Buttons From Any Elements - toggleButton.js

The toggleButton.js jQuery plugin enables you to dynamically create on/off toggle buttons from any elements.

[Demo] [Download]

---

jQuery Plugin For Labeled Checkbox and Radio Button - Labelauty

A stunning and subtle jQuery plugin for creating checkboxes and radio buttons with checked or unchecked custom labels.

[Demo] [Download]

---

Vanilla JavaScript Toggle Button Plugins:

Dynamic Inline Toggle Button In Vanilla JavaScript – ButtonStrip.js

A vanilla JavaScript plugin that dynamically generates an inline toggle button to trigger actions when you click on the left or right button.

[Demo] [Download]

---

CSS Only Toggle Buttons:

Convert Checkboxes & Radio Buttons Into Grouped Buttons – boxed-check.css

A CSS library that converts normal checkboxes and radio buttons into checkable (toggleable) elements (like buttons and cards) for better UX.

[Demo] [Download]

---

Radio Input Based Toggle Button Group With Pure CSS

A CSS only solution that converts a series of radio inputs into toggle buttons and groups them in an inline button group with gradients.

[Demo] [Download]

---

Create Segmented Controls With Radio Buttons – Toggle Radios

A pure CSS library which converts a group or radios into responsive, customizable, SEO-friendly inline toggle button groups (also called segmented controls).

[Demo] [Download]

---

More Resources:

Seeking more jQuery plugins or JavaScript libraries to create awesome toggle buttons on the web & mobile? See jQuery Toggle Button and JavaScript/CSS Toggle Button sections for more details.