Avatar

Component

About

Here is Avatar component

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Avatar to your project and fits it to your theme.

Code

How Avatar is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

// Avatar with square image

import Component from "@/components/ui/avatar-2";

export default function AvatarWithSquareImage() {
  return (
    <Component
      square
      image="https://cdn.21st.dev/assets/mirror/4c/4cf652179f411fc000d05a5cfee67bf3a04031b3b8747ba77e9b7fc9e2fd3376.avif"
    />
  );
}