로고SEED Design

Avatar

Avatar는 사용자, 조직과 같은 고유한 아이덴티티를 표현하는 컴포넌트입니다.

Installation

npx @seed-design/cli@latest add avatar

Props

PropTypeDefault
asChild?
boolean
false
onLoadingStatusChange?
((status: LoadingStatus) => void)
-
badgeMask?
"none" | "circle" | "flower" | "shield"
none
size?
"20" | "24" | "36" | "42" | "48" | "64" | "80" | "96"
48
fallback?
ReactNode
-
alt?
string
-
src?
string
-

Examples

Size

L
L
L
L
L
L
L

Badge (Circle)

Badge (Flower)

뱃지를 설명하는 대체 텍스트를 제공해야 합니다.

Badge (Shield)

뱃지를 설명하는 대체 텍스트를 제공해야 합니다.

Stack

On this page