Component

Neo Avatar

A bold representation of users. Supports image loading, smart fallbacks, and status indicators with brutal styling.

01 Installation

Copy the source code below into your project.

Source Code

New Component

src/components/neo/

Or switch to the "Code" tab to view manually

Simple Avatars

Available in `sm`, `md`, `lg`, and `xl`. The borders and shadows scale with the size.

Avatar Sizes

Supports both `square` (default) and `circle`. Status indicators are hard-bordered for visibility.

Status Indicators

Team Stack

Anime Squad

+99

Join the squad today.

Prop	Type	Default	Description
src	string	undefined	URL of the avatar image.
fallback	string	-	Initials to show when image fails or isn't provided.
size	"sm" \| "md" \| "lg" \| "xl"	"md"	Size of the avatar.
shape	"square" \| "circle"	"square"	Shape of the avatar.
status	"online" \| "offline" \| "busy" \| "away"	undefined	Shows a status indicator dot.