Home
Mohit Prajapati
Avatar Group

Avatar Group

This tailwind example is contributed by Mohit Prajapati, on 04-Aug-2022. Component is made with Tailwind CSS v3.

Avatar

Author Mohit Prajapati

9.4k

11

Fork Fullscreen

<div class="flex flex-row-reverse justify-end -space-x-3 space-x-reverse">
  <div
    class="relative flex h-8 w-8 shrink-0 select-none items-center justify-center rounded-full bg-gray-100 text-sm font-bold uppercase text-gray-800 ring ring-white">
    <img
      class="h-full w-full rounded-full object-cover object-center"
      src="https://source.boringavatars.com/beam/5?square" />
  </div>
  <div
    class="relative flex h-8 w-8 shrink-0 select-none items-center justify-center rounded-full bg-gray-100 text-sm font-bold uppercase text-gray-800 ring ring-white">
    <img
      class="h-full w-full rounded-full object-cover object-center"
      src="https://source.boringavatars.com/beam/6?square" />
  </div>
  <div
    class="relative flex h-8 w-8 shrink-0 select-none items-center justify-center rounded-full bg-gray-100 text-sm font-bold uppercase text-gray-800 ring ring-white">
    <img
      class="h-full w-full rounded-full object-cover object-center"
      src="https://source.boringavatars.com/beam/7?square" />
  </div>
  <div
    class="relative flex h-8 w-8 shrink-0 select-none items-center justify-center rounded-full bg-gray-100 text-sm font-bold uppercase text-gray-800 ring ring-white">
    <img
      class="h-full w-full rounded-full object-cover object-center"
      src="https://source.boringavatars.com/beam/8?square" />
  </div>
</div>

Related Examples

User avatar group

Author:
JaxStone

2 years ago

14.1k
User avatar group

Author:
Samuel Dawson

2 years ago

10.5k
Avatar with Gradient Shadow

Author:
Prajwal Hallale

2 years ago

10k
Responsive Pricing Table
can be used when you want to price

Author:
Bonimater

1 week ago

12
Stylish Mobile-First Navigation Bar Using Tailwind
This project showcases a sleek, fixed-top responsive navigation bar crafted with Tailwind CSS. Featuring a vibrant gradient background, a bold uppercase logo, and smooth pink hover effects, it adapts beautifully across devices. On desktop, the navigation links appear horizontally with ample spacing, while on mobile, a hamburger menu toggles a stylish dropdown with rounded corners and subtle shadows. The navbar’s semi-transparent backdrop with blur adds a modern glassmorphism touch, making it perfect for contemporary web designs.

Author:
Bonimater

1 week ago

35
CTA block
with user avatars and 2 buttons

Author:
Carla Hoffman

1 year ago

1.9k
chat ui advanced
Professional chat ui, connect me for jsx https://abhirajk.vercel.app/

Author:
Abhiraj

4 months ago

899
canvas fully covers
canvas fully covers

Author:
Balogun David Olajuwon

3 weeks ago

115
Profit Card
Profit card with deatils

Author:
dongol heart

6 months ago

1k
Food delivery ecommerce Card

$$@(\/)(\/)Y$ Author:
$@(\/)(\/)Y

4 months ago

898
Avatar
Avatar

$$@(\/)(\/)Y$ Author:
$@(\/)(\/)Y

1 year ago

4k
User Profile
User Profile

$$@(\/)(\/)Y$ Author:
$@(\/)(\/)Y

1 year ago

4.8k

Explore components by Tags

Didn't find component you were looking for?

Search from 2400+ components

TailwindFlex.com

Tailwindflex.com is a free Tailwind CSS examples library. It's a one-stop destination for ready-made Tailwind CSS components and templates.

Contact

Email: admin@tailwindflex.com

Resources

Tailwind CSS Gradient Generator Free Bootstrap CSS Components Free CSS Components

© 2025 TailwindFlex. All Rights Reserved.

v1.1