Avatar

Basic

jui-avatar の最も基本的な使用例です。

size プロパティを使用してコンポーネントの大きさを変更します。

jui-avatar — アバターコンポーネント

HeroUI Avatar インスパイア。画像、イニシャル、フォールバック対応。

コンポーネントが受け付ける属性（Props）の一覧と詳細仕様です。

Property	Attribute	Description	Type	Default
`alt`	`alt`	alt テキスト	`string`	`''`
`avatarLabel`	`avatar-label`	フォールバックラベル（i18n対応）	`string`	`'Avatar'`
`color`	`color`	カラー（イニシャル背景）	`"brand" \| "danger" \| "neutral" \| "success" \| "warning"`	`'neutral'`
`name`	`name`	名前（イニシャル生成用）	`string`	`''`
`shape`	`shape`	形状	`"circle" \| "square"`	`'circle'`
`size`	`size`	サイズ	`"lg" \| "md" \| "sm"`	`'md'`
`src`	`src`	画像URL	`string`	`''`

コンポーネント内に子要素を挿入するためのスロット一覧です。

Slot	Description
	カスタムコンテンツ（アイコン等）

CSSから直接スタイリング可能な内部要素（Parts）の一覧です。

Built with StencilJS