Para cambiar el color del `label` <!-- begin snippet: js hide: false console: true babel: false --> <!-- language: lang-css --> .checkBoxLabel { width: 200px; padding: 10px 0; background-color:#c9c9c9; border-radius:5px; cursor:pointer; text-align: center; display: inline-block; } .checkBox:checked + .checkBoxLabel { background-color: pink; color: #fff; } div { margin-top: 40px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } <!-- language: lang-html --> <div> <input type="checkbox" id="check" class="checkBox"> <label for="check" class="checkBoxLabel">My Label</label> </div> <!-- end snippet -->