Checkbox.css

<p align="center"> <img src="http://i.imgur.com/itrD5Oz.png" width="250"/> </p> <p align="center" style="text-align:center"> <b>A tiny set of CSS3 animations meant for your checkbox inputs.</b> </p> <p align="center"> _{... and for radio inputs check out <a href="https://github.com/720kb/radiobox.css">radiobox.css</a>} </p> <p align="center"> <sub style="font-size:12px;"> ... and for super powers check out <a style="font-size:12px;" href="https://github.com/720kb/checked.css">checked.css</a> </sub> </p> </br> <p align="center" style="text-align:center"> <a href="https://gitter.im/720kb/checkbox.css?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge" target="_blank"> <img src="https://badges.gitter.im/Join%20Chat.svg"/> </a> </p> <br/> <p align="center" style="text-align:center"> <b>Installation</b> </p> <p align="center" style="text-align:center"> Include the <i>dist/css/checkbox.min.css</i> in your html page </p> <p align="center" style="font-size:12px;"> _{<i>Include dist/css/yo.min.css instead, if you want to use only the <b>Yo</b> animation, for example.</i>} </p> <br/> <p align="center" style="text-align:center"> <b>Animations</b> </p> <p align="center" style="text-align:center"> Hey </p> <p align="center" style="text-align:center"> Away </p> <p align="center" style="text-align:center"> Inout </p> <p align="center" style="text-align:center"> Rotate </p> <p align="center" style="text-align:center"> Yo </p> <p align="center" style="text-align:center"> Roll </p> <p align="center" style="text-align:center"> Up </p> <p align="center" style="text-align:center"> Down </p> <p align="center" style="text-align:center"> Tv </p> <p align="center" style="text-align:center"> Jump </p> <p align="center" style="text-align:center"> Omg </p> <p align="center" style="text-align:center"> Splash </p> <br/> <p align="center" style="text-align:center"> <b>Usage</b> </p> <p align="center" style="text-align:center"> <code style="color:royalblue"> <b>&#x3C;input</b> type="checkbox" class="<b>checkbox-splash</b>"<b>/&#x3E;</b> </code> </p> <br/> <p align="center" style="text-align:center"> <b>Browsers Support</b> </p> <p align="center" style="text-align:center"> <i>Depending on:</i> </p> <p align="center" style="text-align:center"> <a href="http://caniuse.com/#feat=transforms2d" target="_blank">2D Transform</a> </p> <p align="center" style="text-align:center"> <a href="http://caniuse.com/#feat=css-animation" target="_blank">Keyframes</a> </p> <br/> <p align="center" style="text-align:center"> <b>Demo</b> </p> <p align="center" style="text-align:center"> <a href="https://720kb.github.io/checkbox.css">Here</a> </p> <br/> <p align="center" style="text-align:center"> <b>Mantainers</b> </p> <p align="center" style="text-align:center"> <a href="http://720kb.net">720kb</a> </p> <br/> <p align="center" style="text-align:center"> <br/> <b>License</b> </p> <p align="center" style="text-align:center"> (MIT) read <a href="https://github.com/720kb/checkbox.css/blob/gh-pages/LICENSE.md">LICENSE.md</a> </p>