# EuiAvatarContentComponent

**Type:** component



Component for displaying textual content alongside an avatar.
Serves as a container for avatar-content-label and avatar-content-sublabel subcomponents.
Typically used to show user name and additional information like email or role.
Content is projected via ng-content and styled to align properly with the avatar.
Must be used within an eui-avatar parent component for proper layout.

```html
<eui-avatar>
  <eui-avatar-image src="user.jpg"></eui-avatar-image>
  <eui-avatar-content>
    <eui-avatar-content-label>John Doe</eui-avatar-content-label>
    <eui-avatar-content-sublabel>john.doe@ec.europa.eu</eui-avatar-content-sublabel>
  </eui-avatar-content>
</eui-avatar>
```

### Accessibility
- Content is readable by screen readers in natural reading order
- Label and sublabel are semantically grouped for context
- Use meaningful text that identifies the user or entity

### Notes
- Must be direct child of eui-avatar component
- Typically contains eui-avatar-content-label and eui-avatar-content-sublabel
- Layout can be reversed using isReverse on parent eui-avatar
- Automatically styled to align with avatar size variants


**Selector:** `eui-avatar-content`