by Pawan Kumar @jsartisan
One common UI element found in many web applications is a checkbox. While HTML provides a built-in checkbox element, sometimes we need to create custom checkboxes to better suit the design or functionality requirements of our application.
Create a custom checkbox component using HTML, CSS, and JavaScript. The component should have the following features:
- Display a custom checkbox icon.
- Allow toggling between checked and unchecked states when clicked.
- Allow states like hover, focus, intermediate and disabled.
- Allow
small
,medium
, andlarge
size variants.
Take the Carbon Design System's Checkbox as the reference for the style of the checkbox.