import {Avatar} from "attio/client"

​
Props

​
name : string

The name of the person or organization represented by the avatar. This is used for accessibility and may also be used as a fallback display when no image is provided.

​
src : string | null | undefined

The source URL of the avatar image. If not provided or if the image fails to load, the avatar will typically display initials or a fallback representation based on the name.

​
shape? : "round" | "box"

The shape of the avatar. Defaults to "round".

​
variant? : "subtle" | "bold"

The visual variant of the avatar, affecting its styling and prominence. Defaults to "bold".

​
size? : "small" | "medium" | "large"

The size of the avatar.
  • "small" - 16px
  • "medium" - 24px
  • "large" - 32px
Defaults to "medium".

​
Example

<Avatar
    name="John Doe"
    src="https://example.com/profile.jpg"
    shape="round"
    variant="bold"
    size="medium"
/>