x
1
2
3
4
5
<div role="list" aria-label="Avatars" class="flex items-center -space-x-2"><span class="relative flex shrink-0 overflow-hidden rounded-full h-10 w-10 text-sm bg-muted text-foreground/70 ring-2 ring-background" data-slot="avatar" role="listitem"><span class="flex h-full w-full items-center justify-center font-medium" aria-hidden="true">JD</span></span> <span class="relative flex shrink-0 overflow-hidden rounded-full h-10 w-10 text-sm bg-muted text-foreground/70 ring-2 ring-background" data-slot="avatar" role="listitem"><span class="flex h-full w-full items-center justify-center font-medium" aria-hidden="true">AS</span></span> <span class="relative flex shrink-0 overflow-hidden rounded-full h-10 w-10 text-sm bg-muted text-foreground/70 ring-2 ring-background" data-slot="avatar" role="listitem"><span class="flex h-full w-full items-center justify-center font-medium" aria-hidden="true">RM</span></span> <span class="relative flex shrink-0 overflow-hidden rounded-full h-10 w-10 text-sm bg-muted text-foreground/70 ring-2 ring-background" data-slot="avatar" role="listitem"><span class="flex h-full w-full items-center justify-center font-medium" aria-hidden="true">BK</span></span></div>1
2
3
render(UI::AvatarGroup.new(size: size.to_sym)) do |group| INITIALS[0...count.to_i.clamp(1, 8)].each { |init| group.with_avatar { init } }endNo notes provided.
| Param | Description | Input |
|---|---|---|
|
— |
|
|
|
— |
|