benflux/ui
Primitive

Avatar

An image element with a fallback for representing the user.

BFJDVCAB

Installation

npx benflux-ui add avatar

Usage

import { Avatar, AvatarFallback, AvatarImage } from "@benflux-ui/react"

<Avatar>
  <AvatarImage src="/avatar.png" alt="John Doe" />
  <AvatarFallback>JD</AvatarFallback>
</Avatar>

Sizes

XSSMMDLGXL2X

With Ring

DPG

Group

ABC+2

Props

PropTypeDefaultDescription
size"xs" | "sm" | "default" | "lg" | "xl" | "2xl""default"Size of the avatar
ring"none" | "default" | "primary" | "glow""none"Ring style around the avatar