JSFiddle - React, Tailwind, and code Playground

by Liaqat Saeed

HTML

<div class="spinner arrow"><div class="arrow1"></div></div>

CSS

.arrow {
	    -webkit-animation-duration:0.2s;
    -moz-animation-duration: 0.2s;
    animation-duration: 0.2s;
    animation-duration:0.2s;
    height: 80px;
    width: 80px;
    border: 10px solid black;
    border-top: 10px solid transparent;
    position: relative;
}
.spinner:last-child {
    margin: 0;
}

.spinner{   
    border-radius: 50px;
    -webkit-animation: spin 1s infinite linear;
    -moz-animation: spin 1s infinite linear;
    animation: spin 1s infinite linear;
    margin-right: 10px;
    display: inline-block;
    
    }
    @keyframes spin{
    100%{
        
        -webkit-transform:rotate(360deg);
        transform:rotate(360deg);
    }
}

@-webkit-keyframes spin{
    100%{
        
        -webkit-transform:rotate(360deg);
        transform:rotate(360deg);
    }
}

@-moz-keyframes spin{
    100%{
        
        -webkit-transform:rotate(360deg);
        transform:rotate(360deg);
    }
}