SOURCE

<div>
  <input id="shape1" name="box-shape" type="radio" value="123" hidden/>
  <label for="shape1" class="radio-beauty">
  </label>
  <span class="radio-name">
    前端
  </span>
</div>

input[type=radio]:checked + .radio-beauty {
  background-clip: content-box;
  padding: 3px;
  background-color: #4EBD74;
  border-color: #4EBD74
}

.radio-beauty {
  box-sizing: border-box;
  display: inline-block;
  width: 16px;
  height: 16px;
  background: #ffffff;
  border: 1px solid #D9D9D9;
  border-radius: 50%;
  vertical-align: middle;
}

.radio-name {
  vertical-align: middle;
  font-size: 14px;
}