JSFiddle - React, Tailwind, and code Playground

HTML

<li class="kolonki">hello world</li>

CSS

li.kolonki {
    display: inline-block;
    list-style: none;
    background-color: #804a0b;
    background-image: linear-gradient(#cc9a55, #804a0b);
    border-radius: 3px;
    text-transform: uppercase;
    font:12px Arial, Helvetica;
    font-weight: bold;
    padding: 20px 30px;
    cursor:pointer;
}

li.kolonki:hover{
	color:#45250a;
	background: #fff9e0;
	background-image: linear-gradient(#f7d683, #e8c478);
}