JSFiddle - React, Tailwind, and code Playground

HTML

<nav>
  <input type="radio" id="r1" name="r" checked>
  <label for="r1">Шаг 1</label>
  
  <input type="radio" id="r2" name="r">
  <label for="r2">Шаг 2</label>
  
  <input type="radio" id="r3" name="r">
  <label for="r3">Шаг 3</label>
</nav>
<form>
  <div class="form_1">
    <!-- Любые поля для заполнения -->qqq
  </div>
  <div class="form_2">
    <!-- Любые поля для заполнения -->www
  </div>
  <div class="form_3">
    <!-- Любые поля для заполнения -->eee
  </div>
</form>

CSS

body{
  margin: 50px;
}

nav{
  width: 400px;
}

input{
  display: none;
}

.form_1, .form_2, .form_3{
  border: 1px solid #000;
  width: 250px;
  height: 100px;
}

label{
  padding: 1px 20px;
  margin-right: -4px;
}

label:hover{
  cursor: pointer;
  background: #ccc;
}

input:checked + label{
  background: #000;
  color: #fff;
}