Avatar

An image element with a fallback for representing the user.

Was this example helpful?

Usage#

Code
import { Avatar } from "@medusajs/ui"

Code
1<Avatar2  src="https://avatars.githubusercontent.com/u/10656202?v=4"3  fallback="M"4/>

This component is based on the Radix UI Avatar primitive.

Prop	Type	Default
`src`	`string`	-
`fallback`	`string`	-
`variant`	`"squared"` \|`"rounded"`	`"rounded"`
`size`	`"2xsmall"` \|`"xsmall"` \|`"small"` \|`"base"` \|`"large"` \|`"xlarge"`	`"base"`

Was this helpful?