Avatar

Import

import {Avatar} from '@astryxdesign/core/Avatar';

Astryx 문서 권장 방식대로 root barrel이 아니라 컴포넌트 subpath에서 가져옵니다.

When to use

Avatar represents a person or team with a profile photo, initials, or a default icon. Use it in comment headers, contact lists, chat messages, user cards, and anywhere you need ...

Important props

Theming targets

Best practices

• DoAlways pass a name so the avatar can show initials if the photo fails to load, and so screen readers can announce who it represents.
• DoPick a size that matches the context: tiny or xsmall for inline mentions, small or medium for lists and cards, large for profile headers.
• DoAdd a status dot when knowing someone's availability matters, like in chat or team views.
• Do notUse Avatar for logos, product images, or anything that isn't a person or team. Use an image or icon instead.