JSFiddle - React, Tailwind, and code Playground

HTML

<a href="#" class="ui_link_button_2">Кнопка 2</a>

CSS

.ui_link_button_2{
border: 1px solid #1A9EDB;
background-image: -webkit-linear-gradient(top, #0F99D9, #0177AF);
background-image: -moz-linear-gradient(top, #0F99D9, #0177AF);
background-image: -ms-linear-gradient(top, #0F99D9, #0177AF);
background-image: -o-linear-gradient(top, #0F99D9, #0177AF);
background-image: linear-gradient(to bottom, #0F99D9, #0177AF);
color: #ffffff;
font-family: open_sans_regular;
font-size: 12px;
padding: 12px 20px;
text-align: center;
text-decoration: none;
transition-property: background-image;
transition-duration: 3000ms;
transition-timing-function: ease;
transition-delay: 0s; 
}
.ui_link_button_2:hover {
border: 1px solid #13A0E2;
background-image: -webkit-linear-gradient(top, #13A0E2, #0298DE);
background-image: -moz-linear-gradient(top, #13A0E2, #0298DE);
background-image: -ms-linear-gradient(top, #13A0E2, #0298DE);
background-image: -o-linear-gradient(top, #13A0E2, #0298DE);
background-image: linear-gradient(to bottom, #13A0E2, #0298DE);
}