JSFiddle - React, Tailwind, and code Playground

HTML

<div></div>

CSS

div {
    background-color: red;
    height: 10vh;
    width: 10vw;
    
    animation: change_width_back 0.7s forwards;
}
div:hover {
    animation: change_width 0.7s forwards;
}
@keyframes change_width {
    from {
        width: 10vw;
    }
    to {
        width: 15vw;
    }
}
@keyframes change_width_back {
    from {
        width: 15vw;
    }
    to {
        width: 10vw:
    }
}