.spinner {
    --spinner-color: 255 255 255; /* Change this one value */

    display: inline-block;
    width: .8rem;
    aspect-ratio: 1;
    border-radius: 50%;
    background: conic-gradient(
            from -8deg,
            rgb(var(--spinner-color) / 1) 0deg 10deg, transparent 10deg 30deg,
            rgb(var(--spinner-color) / .90) 30deg 40deg, transparent 40deg 60deg,
            rgb(var(--spinner-color) / .78) 60deg 70deg, transparent 70deg 90deg,
            rgb(var(--spinner-color) / .66) 90deg 100deg, transparent 100deg 120deg,
            rgb(var(--spinner-color) / .54) 120deg 130deg, transparent 130deg 150deg,
            rgb(var(--spinner-color) / .43) 150deg 160deg, transparent 160deg 180deg,
            rgb(var(--spinner-color) / .33) 180deg 190deg, transparent 190deg 210deg,
            rgb(var(--spinner-color) / .24) 210deg 220deg, transparent 220deg 240deg,
            rgb(var(--spinner-color) / .16) 240deg 250deg, transparent 250deg 270deg,
            rgb(var(--spinner-color) / .10) 270deg 280deg, transparent 280deg 300deg,
            rgb(var(--spinner-color) / .05) 300deg 310deg, transparent 310deg 330deg,
            rgb(var(--spinner-color) / .02) 330deg 340deg, transparent 340deg 360deg
    );
    -webkit-mask: radial-gradient(
            farthest-side,
            transparent 0 57%,
            #000 58% 100%
    );
    mask: radial-gradient(
            farthest-side,
            transparent 0 57%,
            #000 58% 100%
    );
    animation: spinner 0.9s steps(12) infinite;
}

@keyframes spinner {
    to { transform: rotate(1turn); }
}