Tailwind Avatar

Responsive avatar built with Tailwind. Various templates like a circle avatar, square, profile and many more.


Basic example

Avatar
        
            
    <img
      src="https://mdbcdn.b-cdn.net/img/new/avatars/2.webp"
      class="rounded-full w-32"
      alt="Avatar"
    />
    
        
    

With shadow

Avatar
        
            
    <img
      src="https://mdbcdn.b-cdn.net/img/new/avatars/1.webp"
      class="rounded-full w-32 shadow-lg"
      alt="Avatar"
    />
    
        
    

Square

Avatar
        
            
    <img
      src="https://mdbcdn.b-cdn.net/img/new/avatars/5.webp"
      class="rounded-lg w-32"
      alt="Avatar"
    />
    
        
    

With content

Avatar
John Doe

Web designer

        
            
    <div class="text-center">
      <img
        src="https://mdbcdn.b-cdn.net/img/new/avatars/8.webp"
        class="rounded-full w-32 mb-4 mx-auto"
        alt="Avatar"
      />
      <h5 class="text-xl font-medium leading-tight mb-2">John Doe</h5>
      <p class="text-gray-500">Web designer</p>
    </div>
    
        
    

If you are looking for more advanced options, try Bootstrap Avatar from MDBootstrap.