AI Components / Avatar
Avatar
User/agent avatar with status ring, initials fallback, and type-specific colors.
ai-essentials v0.5.0
Playground
Examples
Types
<cg-stack direction="row" gap="md"><ai-avatar name="Alice" status="online" type="user"></ai-avatar><ai-avatar name="Claude" status="online" type="agent"></ai-avatar><ai-avatar name="System" type="system"></ai-avatar><ai-avatar name="Bob" status="away"></ai-avatar></cg-stack>Import
import { AiAvatar } from '@cognivo/components';// Or tree-shake: import '@cognivo/components/ai-avatar';Per-component imports ship only that component (~8 kB gzip).
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
name | string | — | Name for initials |
src | string | — | Image URL |
size | "sm"|"md"|"lg" | "md" | Size |
status | "online"|"away"|"offline"|"busy" | — | Status dot |
type | "user"|"agent"|"system" | "user" | Avatar type |