JSFiddle - React, Tailwind, and code Playground

HTML

<div class="transform origin">
Element to be transformed
</div>

CSS

.transform {
    background: blue;
    border: solid white 1px; 
    color: white;
    position: absolute;
    left: 25%;
    top: 25%;
    height: 200px;
    width: 200px;
    -webkit-transform-origin: 50% 90%;
    -webkit-transform: rotate(0deg);
}

/*a pseudo-element that represents the origin*/
.origin:before {
    left: 50%; /*change this to match the X origin*/
    top: 90%; /*change this to match the Y origin*/

    /*the rest styles the origin indicator*/    
    background: white;
    border-radius: 5px;
    content: "";
    position: absolute;
    margin: -5px 0 0 -5px;
    height: 10px;
    width: 10px;
}