JSFiddle - React, Tailwind, and code Playground

HTML

<div id="clock">
    <div id="hand">
        <div id="topHand"></div>
    </div>    
</div>

CSS

#clock
{
    width: 200px;
    height: 200px;
    border: 3px solid yellow;
    border-radius: 50%;
    
    position: relative;
}

#hand
{
    width: 100%;
    height: 20px;
    
    position: absolute;
    top: 50%;
    margin-top: -10px;
    
    background: black;
    
    -webkit-animation: rotate 10s infinite linear;
}

#topHand
{
    height: 100%;
    width: 20px;
    background: red;
    left: -10px;
    position: absolute;
}

@-webkit-keyframes rotate {
    from {
        -webkit-transform: rotateZ(0deg);
    }
    to {
        -webkit-transform: rotateZ(360deg);
    }
}