> ## Documentation Index
> Fetch the complete documentation index at: https://filament-34a8cf01.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Avatar Blade component

> [!WARNING]
>
> You are currently viewing the documentation for Filament 4.x, which is a previous version of Filament.
>
> Looking for the current stable version? Visit the [5.x documentation](https://filament-34a8cf01.mintlify.site/5.x/components/avatar.md).

## Introduction

The avatar component is used to render a circular or square image, often used to represent a user or entity as their "profile picture":

```blade theme={"theme":"gruvbox-dark-hard"}
<x-filament::avatar
    src="https://filamentphp.com/dan.jpg"
    alt="Dan Harrin"
/>
```

Loading preview

![Avatars](https://filament-34a8cf01.mintlify.site/docs/images/4.x/light/components/avatar/simple.jpg)

## Setting the rounding of an avatar

Avatars are fully rounded by default, but you may make them square by setting the `circular` attribute to `false`:

```blade theme={"theme":"gruvbox-dark-hard"}
<x-filament::avatar
    src="https://filamentphp.com/dan.jpg"
    alt="Dan Harrin"
    :circular="false"
/>
```

Loading preview

![Square avatars](https://filament-34a8cf01.mintlify.site/docs/images/4.x/light/components/avatar/square.jpg)

## Setting the size of an avatar

By default, the avatar will be "medium" size. You can set the size to either `sm`, `md`, or `lg` using the `size` attribute:

```blade theme={"theme":"gruvbox-dark-hard"}
<x-filament::avatar
    src="https://filamentphp.com/dan.jpg"
    alt="Dan Harrin"
    size="lg"
/>
```

Loading preview

![Avatars in different sizes](https://filament-34a8cf01.mintlify.site/docs/images/4.x/light/components/avatar/sizes.jpg)

You can also pass your own custom size classes into the `size` attribute:

```blade theme={"theme":"gruvbox-dark-hard"}
<x-filament::avatar
    src="https://filamentphp.com/dan.jpg"
    alt="Dan Harrin"
    size="w-12 h-12"
/>
```

[Edit this page on GitHub](https://github.com/filamentphp/filament/edit/4.x/docs/12-components/03-avatar.md)

## Sponsored by

[Your logo here](https://github.com/sponsors/danharrin)


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.