Skip to content
Nariman Bortov edited this page Jul 2, 2023 · 3 revisions

Import

import { Avatar } from '@narimanb/wreactui'

Size

There are three sizes, applied by the prop size: large, regular (default) and small.

image

Code

<Avatar size="large" src="/img/avatar-1.jpg" alt="Judith" />
<Avatar src="/img/avatar-1.jpg" alt="Judith" />
<Avatar size="small" src="/img/avatar-1.jpg" alt="Judith" />

Image

Pass an image to the avatar using the prop src.

Code

<Avatar src="/img/avatar-1.jpg" alt="Judith" />

Alternate text

Pass an alternate text to the avatar using the prop alt.

image

Code

<Avatar src="/img/avatar-2.jpg" alt="George" />

Props overview

Prop Description Type Default
size define the size of component large, regular, small regular
src required define the source of the image string
alt required alternate text of the image string