Answers for "if checkbox is checked change background color"

how to change checkbox checked color in css

input[type="checkbox"]:checked + label::after {
       content: '';
       position: absolute;
       width: 1.2ex;
       height: 0.4ex;
       background: rgba(0, 0, 0, 0);
       top: 0.9ex;
       left: 0.4ex;
       border: 3px solid blue;
       border-top: none;
       border-right: none;
       -webkit-transform: rotate(-45deg);
       -moz-transform: rotate(-45deg);
       -o-transform: rotate(-45deg);
       -ms-transform: rotate(-45deg);
       transform: rotate(-45deg);
    }

    input[type="checkbox"] {
       line-height: 2.1ex;
    }

    input[type="radio"],
    input[type="checkbox"] {
        position: absolute;
        left: -999em;
    }

    input[type="checkbox"] + label {
        position: relative;
        overflow: hidden;
        cursor: pointer;
    }

    input[type="checkbox"] + label::before {
       content: "";
       display: inline-block;
       vertical-align: -25%;
       height: 2ex;
       width: 2ex;
       background-color: white;
       border: 1px solid rgb(166, 166, 166);
       border-radius: 4px;
       box-shadow: inset 0 2px 5px rgba(0,0,0,0.25);
       margin-right: 0.5em;
    }

change the body background color with javascript checkbox using

blue=document.getElementsByClassName("check1")[0]
red=document.getElementsByClassName("check2")[0]
yellow = document.getElementsByClassName("check3")[0]
function colors(color) {
    document.body.style.backgroundColor = color;
}
 blue.addEventListener("click", e => {
     if (blue.checked) {
         colors("blue")
     }
     else if (red.checked) {
         colors("red")
     }
     else if (yellow.checked) {
         colors("yellow")
         }
     else {
    colors("white")         
     }
 })

red.addEventListener("click", e => {
    if (red.checked) {
       colors("red")
    }
    else if (blue.checked) {
        colors("blue")
    }
    else if (yellow.checked) {
        colors("yellow")
    }
    else {
     colors("white")
    }
})
yellow.addEventListener("click", e => {
    if (yellow.checked) {
     colors("yellow")
    }
    else if (red.checked) {
        colors("red")
    }
    else if(blue.checked){
      colors("blue")
    }
    else {
       colors("white")
    }
})