---
url: https://talkjs.com/docs/UI_Components/JavaScript/Classic/Themes/Components/Avatar
---

# Avatar

Customize how a user's profile picture is rendered.

Ask a question Copy for LLM [View as Markdown](/docs/UI_Components/JavaScript/Classic/Themes/Components/Avatar.md)
The `Avatar` component is a subcomponent that is part of all preset themes. It is used to render a user's profile picture.

## Props

Our preset themes pass the following props to the `Avatar` component. You can change the props it receives by updating the places in the theme where the component is invoked.

| Name | Type | Description |
| --- | --- | --- |
| **photoUrl** | `string` | The URL of the user's profile picture |
| **float** | `"left" \| "right"` | Whether to float the avatar left or right |

## Available system components

The `Avatar` subcomponent is used in multiple places within the theme. The available system components depend on the top-level component that renders it. The only system components that are always available are [globally available system components](/docs/UI_Components/JavaScript/Classic/Themes/Components/Global_Components_and_Variables/#globally-available-system-components).