10 Best Checkbox And Radio Input Replacements (2020 Update)

This is an up-to-date list of 10 best JavaScript and/or CSS libraries that can be used to beautify and enhance the native, ugly, hard-to-style checkboxes and radio buttons in your HTML forms. I hope you like it.

Originally Published Dec 28 2017, updated Apr 16 2020

See also:

1. Awesome Bootstrap Checkbox

Pretty Checkbox & Radio Inputs with Bootstrap and awesome-bootstrap-checkbox.css
A pure CSS solution to beautify the default checkboxes & radio buttons with Bootstrap styles.

Demo Download


2. Pretty Checkbox & Radio Button Replacement – Pretty.css

Pretty.css
Pretty is a pure CSS/SASS library used to replace the default checkbox & radio inputs with custom icons.

Demo Download


3. checkboxes.css

Pretty Checkbox CSS Library – checkboxes.css

Demo Download

checkboxes.css is a pure CSS library used to prettify the regular checkbox inputs with custom styles as shown in the demo page.


4. Creating iOS Style On / Off Toggles With JavaScript And CSS3 – Switch.js

Switch.js

Demo Download

Just another JavaScript plugin used for creating customizable, CSS3 animated, iOS-style on/off toggle switches from regular checkbox inputs.


5. Magic-check

Magic-check

Demo Download

Magic-check is a very small CSS library used for replacing the default ugly checkboxes and radio buttons.


6. Converts Bootstrap Checkboxes Into Toggle Switches – TiTatoggle

Converts Bootstrap Checkboxes Into Toggle Switches - TiTatoggle

Demo Download

TiTatoggle is a CSS extension to the Bootstrap framework that converts the regular checkbox inputs into different types of toggle switches.


7. icheck-material

Material Design Checkboxes & Radio Buttons In Pure CSS – icheck-material

Demo Download

icheck-material is a CSS/CSS3 library that lets you beautify & animate the regular checkboxes and radio buttons with Material Design styles.


8. Custom Checkbox And Radio Inputs In Pure CSS

Custom Checkbox And Radio Inputs In Pure CSS

Demo Download

A collection of CSS styles to customize the checkboxes and radio buttons with your own styles, images, and CSS sprites.


9. Material & iOS Style Checkbox & Radio Inputs With Pure CSS

Material & iOS Style Checkbox & Radio Inputs With Pure CSS

Demo Download

A lightweight and pure CSS solution to create Material Design and iOS inspired animated checkboxes and radio buttons for your HTML form. Fully customizable via CSS & LESS.


10. Radio Input Based Toggle Button Group With Pure CSS

Radio Input Based Toggle Button Group With Pure CSS

Demo Download

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


Leave a Reply

You Might Be Interested In: