profileavatarusertailwindflexboxresponsivelist-item

Compact User Profile Avatar with Details

Компактный профиль пользователя: круговой аватар, имя, роль. Адаптивный дизайн с TailwindCSS. Идеален для списков контактов, комментариев, навигации.

Live Preview

Prompt

<div class="flex gap-4 items-center">
  <img src="https://hoirqrkdgbmvpwutwuwj-all.supabase.co/storage/v1/object/public/assets/assets/13a5581f-35ac-4b9e-ae7c-47573e09ab8e_320w.jpg" alt="Portrait" class="h-10 w-10 ring-1 ring-neutral-200 object-cover rounded-full">
  <div class="min-w-0">
    <p class="truncate text-sm font-medium">Alex Parker</p>
    <p class="truncate text-xs text-neutral-500">Web-designer, developer</p>
  </div>
</div>

All Prompts