JSFiddle - React, Tailwind, and code Playground
by khamer
HTML
<button class="button">button</button>
<Br>
<button class="button button-thing">button</button>
SCSS
.button {
background: linear-gradient(135deg, red 0, red 50%, transparent 50%);
background-color: lime;
background-repeat: no-repeat;
transition: background 500ms;
}
.button:hover,
.button-thing {
background-position: 0 0;
}