Components

Avatar

A round picture, or the name's initial on the glowing accent. With an in-browser crop for uploads.

Priya

Import

import { Avatar } from '@rinzai/zen';

cropImageToSquare centres, crops and shrinks a chosen image in the browser to a small data URL.

Round profile picture; without an image, the name's initial on the glowing accent. Decorative (hidden from screen readers) unless you give it alt.

Prop	Type	Default
`name`Required Name or email, for the initial.	`string`	`—`
`alt` Accessible name; leave out when the name is shown next to the avatar.	`string`	`—`
`className` Size and more, e.g. "size-12 text-lg" (default size-9).	`string`	`—`
`src` Image URL (or data URL); without it, or if it fails to load, the initial is shown.	`string \| null`	`—`