Avatar

An image element with a fallback for representing the user.

When To Use

Use avatars to represent a user or entity. They're useful for:

User profiles
Account menus
Comment sections
Chat interfaces
User lists
Team members displays

Avatars provide a visual representation of users and can help make interfaces more personable and engaging.

Examples

Basic#

CNCHTP

Sizes#

XSSMMDLGXL

Fallback#

JDABCDEF404

Group#

CNCHTP+3

CNCHTP

Project Team

Props

Prop	Type	Default
`$$typeof`	`symbol`	-
`displayName?`	`string`	-
`propTypes?`	`any`	-

Prop	Type	Default
`$$typeof`	`symbol`	-
`displayName?`	`string`	-
`propTypes?`	`any`	-

Prop	Type	Default
`$$typeof`	`symbol`	-
`displayName?`	`string`	-
`propTypes?`	`any`	-

Aspect Ratio

Maintains a consistent width-to-height ratio for elements.

Badge

Small status descriptor for UI elements.