JSFiddle - React, Tailwind, and code Playground

HTML

<div class="radio">
 <input id="radio2" type="radio" checked="" name="radio2">
 
 <label for="radio2">Пункт выбора</label>
 </div>
 <div class="radio">
 <input id="radio22" type="radio" name="radio2">
<label for="radio22">Пункт выбора</label>

 </div>

CSS

.radio {
 height: 21px;
 margin-bottom: 13px;
 position: relative;
}

.radio input {
 display: block;
 left: 5px;
 position: absolute;
 top: 5px;
}

.radio label:before {
 background: none repeat scroll 0 0 #FFFFFF;
 border-radius: 15px 15px 15px 15px;
 content: "";
 display: block;
 height: 13px;
 left: 0;
 position: absolute;
 top: 6px;
 width: 13px;
}

.radio input[type="radio"]:checked + label:after {
 background: none repeat scroll 0 0 #C91538;
 border-radius: 13px 13px 13px 13px;
 content: "";
 display: block;
 height: 5px;
 left: 4px;
 position: absolute;
 top: 10px;
 width: 5px;
}

.radio label:after {
 display: none;
}

.radio label {
 background: none repeat scroll 0 0 #D7D7D7;
 color: #787878;
 display: block;
 font-size: 14px;
 height: 21px;
 left: 0;
 padding-left: 40px;
 position: absolute;
 top: 0;
 width: auto;
}