【React】Identiconをデフォルトアバターに使用する

以下のライブラリを使用してIdentionを生成できます。

インストール

以下のコマンドでインストールします。

npm install boring-avatars

使用方法

以下のように記述することで使用できます。

import Avatar from "boring-avatars";

<Avatar
  size={128}
  name="User Name"
  variant="marble"
  colors={["#92A1C6", "#146A7C", "#F0AB3D", "#C271B4", "#C20D90"]}
/>;

nameの値によってIdentionが生成されます。

上記の場合には以下のようなアバターになります。

また、variantにはmarble, beam, pixel,sunset, ring, bauhausが使用できそれぞれ以下のようなアバターになります。

• marble
  

• beam
  

• pixel
  

• sunset
  

• ring
  

• bauhaus