JSFiddle - React, Tailwind, and code Playground

by oduska

HTML

<div class="loading">
    <img src="https://i.imgur.com/hFHAzxG.gif">
</div>

SCSS

body {
    text-align: center;
    font-family: Arial;
}

.loading {
    border: 8px solid #ccc;
    display: inline-block;
    border-radius: 50%;
    width: 14em;
    height: 14em;
    position: relative;
    
    img {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -46%);
    }
}