pinafore/routes/_components/LoadingSpinner.html

<svg class="loading-spinner-icon {{maskStyle ? 'mask-style' : ''}}">
  <use xlink:href="#fa-spinner" />
</svg>
<style>
  .loading-spinner-icon {
    width: 64px;
    height: 64px;
    fill: var(--svg-fill);
    animation: spin 2s infinite linear;
  }

  .loading-spinner-icon.mask-style {
    fill: var(--mask-svg-fill);
  }

  @keyframes spin {
    0% {
      transform: rotate(0deg);
    }
    25% {
      transform: rotate(90deg);
    }
    50% {
      transform: rotate(180deg);
    }
    75% {
      transform: rotate(270deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }
</style>