Checkbox by PriyanshuGupta28

1.checkbox-wrapper input[type="checkbox"] {
2  visibility: hidden;
3  display: none;
4}
5
6.checkbox-wrapper *,
7  .checkbox-wrapper ::after,
8  .checkbox-wrapper ::before {
9  box-sizing: border-box;
10  user-select: none;
11}
12
13.checkbox-wrapper {
14  position: relative;
15  display: block;
16  overflow: hidden;
17}
18
19.checkbox-wrapper .label {
20  cursor: pointer;
21}
22
23.checkbox-wrapper .check {
24  width: 50px;
25  height: 50px;
26  position: absolute;
27  opacity: 0;
28}
29
30.checkbox-wrapper .label svg {
31  vertical-align: middle;
32}
33
34.checkbox-wrapper .path1 {
35  stroke-dasharray: 400;
36  stroke-dashoffset: 400;
37  transition: .5s stroke-dashoffset;
38  opacity: 0;
39}
40
41.checkbox-wrapper .check:checked + label svg g path {
42  stroke-dashoffset: 0;
43  opacity: 1;
44}