Fancy Checkbox

—-—-- Features

Vector based totally (fully scalable) Natural CSS No Javascript All you want to do is to include CSS! HTML integrated to offer implementation examples.

How to use

1. Include ‘fency-style-checkbox.css’ to code.

2. Practice class ‘checkboxWrapper’ and sophistication for checkbox dimension to discern part. Followings are classes for various sizes: a.extraSmallCheckboxSize b.smallCheckboxSize c.mediumCheckboxSize d.largeCheckboxSize e.extraLargeCheckboxSize Be Aware:-1. If no magnificence for measurement is applied to parent, it is going to take ‘largeCheckboxSize’ by default. 2. Any HTML component will also be used as parent element.

THREE. Observe elegance for theme color to determine. Followings are categories for default issues: a.theme1 b.theme2 c.theme3 d.theme4 e.theme5 f.theme6 g.theme7 Observe:- You Can create your individual elegance for custom topic.

FOUR. Upload the next HTML code for checkbox within the parent.

<input type=”checkbox” identification=”sample1”> <label for=”sample1”> <svg model=”1.1” identification=”Layer_1” xmlns=”http://www.w3.org/2000/svg” xmlns:xlink=”http://www.w3.org/1999/xlink” x=”0px” y=”0px” width=”50px” height=”50px” viewBox=”ZERO 0 50 50” permit-heritage=”new 0 ZERO 50 50” xml:area=”maintain”> <circle fill=”none” stroke=”#B7B7B7” stroke-width=”3” stroke-miterlimit=”10” cx=”25.11” cy=”24.883” r=”23.519”/> <path fill=”none” stroke-width=”THREE” stroke-miterlimit=”10” d=”M48.659,25c0,12.998-10.537,23.534-23.534,23.534 S1.591,37.998,1.591,25S12.127,1.466,25.125,1.466c9.291,ZERO,17.325,FIVE.384,21.151,13.203L19,36l-9-14”/> </svg> Turquoise Theam </label>

FIVE. And right here you move!!!

Thank You again for getting this item. if you happen to may have any drawback in using this, feel free to invite by means of electronic mail on ‘bread.byte.design@gmail.com’.

FULL DOWNLOAD