JSFiddle - React, Tailwind, and code Playground

HTML

<div class="content"/>

CSS

.content {
    display: inline-block;
    height: 200px;
    width: 200px;
    border: solid 0px;
    vertical-align: middle;
    border-radius: 2000px;
    background-color: #ccc;
    margin: 0px;
}

JavaScript

$(function(){
    $(".content").mouseover(function(){
        $(this).animate({"borderLeftWidth" : "5px",
                         "borderRightWidth" : "5px", 
                         "borderTopWidth" : "5px", 
                         "borderBottomWidth" : "5px",
                         
                         "marginLeft" : "-5px",
                         "marginTop" : "-5px",
                         "marginRight" : "-5px",
                         "marginBottom" : "-5px"
                        }, 300);
    }).mouseout(function(){
            $(this).animate({"borderLeftWidth" : "0px", 
                             "borderRightWidth" : "0px", 
                             "borderTopWidth" : "0px", 
                             "borderBottomWidth" : "0px",
                             
                             "marginLeft" : "0px",
                             "marginTop" : "0px",
                             "marginRight" : "0px",
                             "marginBottom" : "0px"
                            }, 300);
    });
});