Netzo Logo

avatar

An image element with a fallback for representing the user.

shadcn/ui radix-ui Storybook Figma

Usage

After installation components can be imported and used directly.

import {
  Avatar,
  AvatarFallback,
  AvatarImage,
} from 'netzo/components/avatar.tsx'

Examples

Working examples to copy-paste into projects under components/.

Default

import {
  Avatar,
  AvatarFallback,
  AvatarImage,
} from "netzo/components/avatar.tsx";

export default () => {
  return (
    <Avatar>
      <AvatarImage src="https://github.com/netzo.png" alt="@netzo" />
      <AvatarFallback>CN</AvatarFallback>
    </Avatar>
  );
};