JSFiddle - React, Tailwind, and code Playground

by niki4810

HTML

<button class="hoverEffectBtn">Button with hover transition</button>

<button>Button without hover transition</button>

CSS

button {
    background : #fff;
    color : #000;
}
button:hover {
    background:#000;
    color : #fff;
}
.hoverEffectBtn {
    -webkit-transition:all 0.5s;
    -moz-transition:all 0.5s;
    -ms-transition:all 0.5s;
    -o-transition:all 0.5s;
    transition:all 0.5s;
}
hoverEffectBtn:hover {
    -webkit-transition:all 0.5s;
    -moz-transition:all 0.5s;
    -ms-transition:all 0.5s;
    -o-transition:all 0.5s;
    transition:all 0.5s;
}