JSFiddle - React, Tailwind, and code Playground

HTML

<div id="box">Demo Box</div>

CSS

#box
{
 margin: 10px;
 height: 80px;
 width: 180px;
 background-color: #ccc;
 padding: 4px;
}

.line { 
    width: 0;
    height: 0;
    position: absolute;
    background-color: red;
}

JavaScript

function drawRectangle(target, thickness, duration) {
    
    var w = target.outerWidth() + thickness;
    var h = target.outerHeight() + thickness;
    var total = w+w+h+h;

    var wDuration = (w * 1.00 / total) * duration;
    var hDuration = (h * 1.00 / total) * duration;

    // hide flickering when both expanding and moving
    var tolerance = 1;

    var line1 = $('<div />', { class: 'line' }).css({
        left: target.offset().left,
        top: target.offset().top - thickness,
        height: thickness
    }).appendTo('body');

    line1.animate({ width: w }, wDuration, function() {

        var line2 = $('<div />', { class: 'line' }).css({
            left: target.offset().left + w - thickness,
            top: target.offset().top,
            width: thickness
        }).appendTo('body');

        line2.animate({ height: h }, hDuration, function() {
            
            var line3 = $('<div />', { class: 'line' }).css({
                left: target.offset().left + w + tolerance,
                top: target.offset().top + h - thickness,
                height: thickness
            }).appendTo('body');

            line3.animate({ width: w, left: target.offset().left - thickness }, wDuration, function() {
                    
                var line4 = $('<div />', { class: 'line' }).css({
                    left: target.offset().left - thickness,
                    top: target.offset().top + h + tolerance,
                    width: thickness
                }).appendTo('body');
                
                line4.animate({ height: h + tolerance, top: target.offset().top - thickness }, hDuration);
                
            });
            
        });
        
    });
    
}
    
drawRectangle($('#box'), 3, 3000);