Skip to Content
Forui 0.17.0 is released 🎉
DocumentationData PresentationAvatar

Avatar

A circular image component that displays user profile pictures with a fallback option. The Avatar component provides a consistent way to represent users in your application, displaying profile images with fallbacks to initials or icons when images are unavailable.

API Reference

Overview

CLI

To generate and customize this style:

dart run forui style create avatar

Usage

FAvatar(...)

FAvatar(
  image: const NetworkImage('https://example.com/profile.jpg'),
  style: (style) => style.copyWith(...),
  size: 40.0,
  semanticsLabel: 'User avatar',
  fallback: const Text('JD'),
);

FAvatar.raw(...)

FAvatar.raw(
  child: const Text('MN'),
  style: (style) => style.copyWith(...),
  size: 40.0,
);

Examples

Raw

Fallback

Last updated on
AccordionBadge