JSFiddle - React, Tailwind, and code Playground

HTML

<a href="" class="button">my button</a>
<a href="" class="button button-danger">danger button</a>

CSS

.button {
  display: inline-block;
  padding: 10px 20px;
  background-color: #ccc;
  color: #333;
  text-decoration: none;
  white-space: nowrap;
  border-radius: 5px;
}

.button:focus, 
.button:active,
.button:hover {
  outline: 0;
  color: #fff;
}

.button-danger {
  background-color: #e74c3c;
  color: #fff;
}

.button-danger:hover {
  background-color: #c0392b;
}