JSFiddle - React, Tailwind, and code Playground
HTML
<div>
</div>
CSS
html, body{
height: 100vh;
width: 100vw;
background: #666;
overflow: hidden;
}
div{
height: 300px;
width: 200px;
border-radius: 10px;
background: white;
position: absolute;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
transition: .75s all ease-in-out;
border: 0 solid rgba(0,0,0,0.7);
}
div:hover{
height: 400px;
width: 300px;
border-width: 1000px;
border-radius: 10px;
}