Components

Avatar

An image element with a graceful text fallback.

FLSQ

Usage

With @flagon-io/ui installed (see Installation), import it directly.

import { Avatar, AvatarImage, AvatarFallback } from "@flagon-io/ui";

<Avatar>
  <AvatarImage src="/me.png" alt="" />
  <AvatarFallback>SQ</AvatarFallback>
</Avatar>

Prefer to own the code?

You don’t have to install the package - you can copy this component into your project with the shadcn CLI and edit it freely.

npx shadcn@latest add https://ui.flagon.io/r/avatar.json