jQuery plugin for custom checkboxes and radio buttons – wCheck

wCheck is a jQuery plugin for creating custom checkboxes and radio buttons. Adjust the appearance of form UI elements easily.

Creating custom checkboxes and radio buttons with jQuery

This plugin is a simple and effective solution, which allows use to apply images to style of radio buttons and checkboxes. wCheck.js is a great support for fully customizable checkbox and radio input options. The plugin uses images for background themes and selectors to allow for compatability with many browsers.

The plugin works by overlaying the original checkbox and radio on top of the image, to change the view but keep the functionality of an input element.

wCheck - a jQuery plugin for making customizable checkboxes and radios
wCheck – a jQuery plugin for making custom checkboxes and radios


1. Include the following two files:

<script type="text/javascript" src="./wCheck.js"></script>
<link rel="Stylesheet" type="text/css" href="./wCheck.css" />

Then we can apply the plugins to any radio and checkbox, for example:



Please note, that we can set defaults for wCheck and wRadio separately:

$.fn.wCheck.defaults = {
    theme: 'square-classic-blue',   
    selector: 'checkmark',          
    useExistingLabel: true,         
    highlightLabel: false           
$.fn.wRadio.defaults = {
    theme: 'circle-classic-blue',   
    selector: 'circle-dot-blue',    
    useExistingLabel: true,         
    highlightLabel: false           

We can adapt themes and labels. See more in the documentation.

License: MIT

Demos & docs:




See also:

Checkboxradio – jQuery checkbox replacement plugin

Ideal Forms 3: build and validate responsive HTML5 forms

jQuery plugin for custom select menus

jQuery nested checkboxes – Deep Checkbox plugin

Select2 – the jQuery replacement for select boxes

Fancy sliding form jQuery


Share:Share on Facebook3Share on Google+0Tweet about this on TwitterShare on LinkedIn1Pin on Pinterest1