JSFiddle - React, Tailwind, and code Playground

HTML

<div class="box">
    <img src="http://www.reviversoft.com/blog/wp-content/uploads/2013/08/Spinning-Beach-Ball1.png" width="100" height="100">
</div>

CSS

.box {
    width: 200px;
    height: 200px;
    background: red;
}

.box img {
    margin-top: 50%;
    margin-left: 50%;
    position:relative;
    
/* These are the values id like to dynamicly set */   
    
    top: -50px; /* being half of the image height */
    left: -50px; /* being half of the image width */
}