<div class="flex items-center justify-center">
  <div class="w-16 h-16 border-b-2 border-white rounded-full animate-spin"></div>
</div>

<div class="flex items-center justify-center pt-6">
  <div style="border-top-color:transparent" class="w-16 h-16 border-4 border-white rounded-full animate-spin"></div>
</div>

<p>
  Purpose: To create minimal loading spinner(s) using only Tailwind classes. No additional CSS or SVG's required.
</p>

/* Demo purposes only */
body {
  background: #333;
  text-align: center;
  padding: 2rem;
}
p {
  font-family: system-ui;
  color: #ccc;
  max-width: 30rem;
  margin: 2rem auto;
}