JSFiddle - React, Tailwind, and code Playground

HTML

<button class='button'>Button 1</button>
<button class='button'>Button 2</button>

CSS

body {
    padding: 10px;
}

.button {
    border-radius: 2px;
    border: 1px solid #ddd;
    border-bottom: 3px solid #ccc;
    background: #eee;
    padding: 5px 10px;
    display: inline-block;
}

.button:hover {
    background: #e7e7e7;
}

.button:active {
    border-bottom: 1px solid #ddd;
    padding: 7px 10px 5px;
}