Avatar With placeholder initials

            
<div class="flex flex-wrap items-end justify-center gap-3">
  <div class="flex h-6 w-6 items-center justify-center overflow-hidden rounded-full bg-teal-100 text-teal-400">
    <span class="text-xs"> SB </span>
  </div>
  <div class="flex h-8 w-8 items-center justify-center overflow-hidden rounded-full bg-teal-100 text-teal-400">
    <span class="text-sm"> SB </span>
  </div>
  <div class="flex h-10 w-10 items-center justify-center overflow-hidden rounded-full bg-teal-100 text-teal-400">
    <span class="text-base"> SB </span>
  </div>
  <div class="flex h-12 w-12 items-center justify-center overflow-hidden rounded-full bg-teal-100 text-teal-400">
    <span class="text-lg"> SB </span>
  </div>
  <div class="flex h-14 w-14 items-center justify-center overflow-hidden rounded-full bg-teal-100 text-teal-400">
    <span class="text-xl"> SB </span>
  </div>
  <div class="flex h-16 w-16 items-center justify-center overflow-hidden rounded-full bg-teal-100 text-teal-400">
    <span class="text-xl"> SB </span>
  </div>
</div>