With name

1import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar'
2 
3export function Avatar08() {
4  return (
5    <div className="flex items-center gap-3">
6      <Avatar>
7        <AvatarImage
8          src="https://images.unsplash.com/photo-1494790108377-be9c29b29330?q=80&w=200&auto=format&fit=crop"
9          alt="Sofia Rodrigues"
10        />
11        <AvatarFallback>SR</AvatarFallback>
12      </Avatar>
13      <div className="flex flex-col">
14        <span className="text-sm font-medium">Sofia Rodrigues</span>
15        <span className="text-muted-foreground text-xs">sofia@example.com</span>
16      </div>
17    </div>
18  )
19}