JSFiddle - React, Tailwind, and code Playground

HTML

<div class="form-holder">
  <input type="checkbox" id="checkbox" />
  <label for="checkbox">This is label for checkbox</label>
</div>

CSS

input[type="checkbox"] {
  -moz-appearance: none;
}

@media all and (max-width: 600px) {
  input[type="checkbox"] {
    width: 25px;
    height: 25px;
  }  
}

@media all and (max-width: 320px) {
  input[type="checkbox"] {
    width: 40px;
    height: 40px;
  }  
}

.form-holder {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}