Avatar (アバター)

    Avatar コンポーネント は、プロフィール写真や画像、アイコン、イニシャル (文字列) などのオプションを備えた人物の視覚的な表現として使用されます。Avatar は、Ignite UI for Angular Avatar コンポーネントと視覚的に同じものです。

    Avatar のデモ

    タイプ

    Avatar は、画像、文字列としてのイニシャル、アイコンなど、さまざまなコンテンツタイプをサポートします。

    サイズ

    Avatar のサイズは 3 つあります。

    • Large: プロフィール ページに適しています。
    • Medium: カスタム メニューや可視化に適しています。
    • Small: 連絡先リストや繰り返しのシナリオに適しています。

    図形

    Avatar コンポーネントには、四角形、角丸、円の 3 つの形状があります。

    スタイル設定

    Avatar は、背景色、イニシャルとそのテキスト スタイル、およびアイコンとその色 (該当する場合) をカスタマイズするオプションを備え、柔軟なスタイル設定が可能です。

    使用方法

    イニシャルやアイコン付きの Avatar を使用する場合は、その色が Avatar の背景と十分なコントラストを持つ色を選択してください。同じ色の類似した色合いや色収差を引き起こすような低コントラストの組み合わせは避けてください。

    良い例 悪い例

    その他のリソース

    関連トピック:

    コミュニティに参加して新しいアイデアをご提案ください。