.knopka {
height: 50px;
width: 50px;
border: 3px solid black;
background-color: #7f7;
transition: all 0.5s;
font-size: 40px;
text-align: center;
color: #369e36;
}
}
.knopka:hover {
transform: rotate(90deg);
border-radius: 50%;
background-color: #5d5;
color: #395239;
}
<div class="knopka">+</div>