Beautiful Checkbox And Radio Button Replacement With Pure CSS – Magic-check


Author: forsigner
Views Total: 48,528 views
Official Page: Go to website
Last Update: February 17, 2016
License: MIT

Preview:

Beautiful Checkbox And Radio Button Replacement With Pure CSS – Magic-check

Description:

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

How to use it:

All you need is to include the style sheet magic-check.css in your html page’s head section.

<link href="css/magic-check.css" rel="stylesheet">

Create a checkbox.

<input class="magic-checkbox" type="checkbox" name="layout" id="1" value="option">
<label for="1"></label>
<label class="text" for="1">
  Checkbox
</label>

Create a radio button.

<input class="magic-radio" type="radio" name="radio" id="2" value="option">
<label for="2">
  Radio button
</label>

See also  CSS Only Text Carousel / Rotator

Leave a Reply

Your email address will not be published. Required fields are marked *