Avatar

Avatars are used to represent an individual, a business, or a celestial being when they interact with any Coingaming brand. While they usually consist of an image, avatars are adaptable - letters or object icons may sometimes be used as fallbacks.

Default

Variants

JS

Rounded

JS

Different colours

Sizes

xs
sm
md
lg
xl
2xl

Active status

Status origin

Avatar props
Name Type Required Default Description
bg_color string No bg-gohan Background color
color string No text-bulma Text color
image_url string No - Path to the image
is_rounded boolean No false
is_status_active boolean No false Active state for status indication
name string No - Capital letters of name
size xs | sm | md | lg | xl | 2xl No md Size for avatar
status_origin %StatusOrigin{ vertical: top | bottom, horizontal: left | right } No %StatusOrigin{vertical: "bottom", horizontal: "right"} Position for status indication