Avatar

A component used for displaying user avatars, with image support and fallback initials for when the image fails to load. For full props documentation, see Radix Avatar.

Examples

tsx

import {Avatar, AvatarFallback, AvatarImage} from '@shopify/shop-minis-react'

export default function MyComponent() {

return (

</Avatar>

)

}

Preview

Examples

Avatar

tsx

import {Avatar, AvatarFallback, AvatarImage} from '@shopify/shop-minis-react'

export default function MyComponent() {
  return (
    <Avatar>
      <AvatarImage src="https://example.com/avatar.png" alt="my-avatar" />
      <AvatarFallback>CN</AvatarFallback>
    </Avatar>
  )
}

Was this page helpful?