a fontawesome css checkbox?

checkbox.css

/* default setup for fontawesome */
.fafter::before {
    font-family: "Font Awesome 5 Pro";
    font-weight: 400;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}

input.fafter[type=checkbox] {
    padding: 0;
    margin: 0;
    width: 100%;
    border: 0px;
    cursor: pointer;
    box-sizing: border-box;
    -webkit-appearance: none;
}

input.fafter[type=checkbox]::before {
    content: "\f04d";
    visibility: visible;
    width: 100%;
    text-align: center;
    border-radius: 0;
    color: #1c94c4;
    cursor: pointer;
    box-sizing: border-box;
}

input.fafter[type=checkbox]:hover::before {
    background-color: rgba(28, 148, 196, 0.2);
}

input.fafter[type=checkbox]:checked::before {
    content: "\f14a";
}