DinachiUIDinachiUI

Avatar

Display

A component for displaying user profile images with fallback support. Includes automatic fallback to initials when images fail to load.

Installation

bash
1npx @dinachi/cli@latest add avatar

Run the CLI command above to automatically install the component and its dependencies.

Examples

Default Avatar

A basic avatar with image and fallback

CN

Avatar Sizes

Different avatar sizes

SML

API Reference

PropTypeDefaultDescription
size
'sm' | 'md' | 'lg''md'The size of the avatar
src
string—The source URL of the avatar image
alt
string—Alternative text for the avatar image
fallback
React.ReactNode—Fallback content when image fails to load