Close

Happy little checkboxes

This is another example of a form with checkboxes designed using CSS and HTML. The boxes are given the type ‘checkbox'. There are four boxes in the form. The box size is pre-defined with $boxSize: 50. The font type is imported from Google with the URL and the label is set with the styles of font-family as 'Poiret One', cursive. The body of the form is given the styles of background as #123456, display as flex, justify-content as center, flex-direction as column, align-items as center, font-family as 'Poiret One', cursive, height as 100vh, color as #fff, and font-size as 100%. The display style of check input is given as none to hide the elements. The CSS style cursor is set with the value of pointer to make the cursor look like a hand. The box has the styles of background: rgba(#000, 0.3), border-radius: 5px, position: relative, width: #{$boxSize}px, height: #{$boxSize}px and transition: background 300ms ease. Source: https://codepen.io/landb/pen/pRQPNX

Post Comment or Questions

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.

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