CSS Checkbox Generator

CSS checkbox generator let's you design and generate CSS3 checkbox for your website and saves your time. You can preview the checkbox and copy or download the generated CSS code.

1Text Options

Padding Top ({{vm.paddingTop}}px)

Padding Left ({{vm.paddingLeft}}px)

Margin Bottom ({{vm.margingBottom}}px)

Font Size ({{vm.fontSize}}px)

2Border Options

Border Thickness ({{vm.borderThickness}}px)

Border Style

Border Color

3Switch Properties

Location Top ({{vm.switchLocTop}}px)

Location Left ({{vm.switchLocLeft}}px)

Height ({{vm.switchHeight}}px)

Width ({{vm.switchWidth}}px)

4Active Color Properties

Background Color

Hover Color

Checked Color

Checked Focus Color

5Icon Properties

Color

Icon Position Top ({{vm.iconTop}}px)

Icon Position Left ({{vm.iconLeft}}px)

Icon Width ({{vm.iconHeight}}px)

Icon Height ({{vm.iconWidth}}px)

Radius ({{vm.radioRadius}}px)

Thickness ({{vm.iconThickness}}px)

6Disabled Properties

Opacity ({{vm.disabledOpacity}}px)

Color

Background Color

Preview

CSS Snippet


        

HTML Code