The avatar component can be used as a visual identifier for a user profile on your website and you can use the examples from Flowbite to modify the styles and sizes of these components using the utility classes from Tailwind CSS. ## Default avatar Use this example to create a circle and rounded avatar on an image element. ```html

``` ## Bordered Apply a border around the avatar component you can use the `ring-{color}` class from Tailwind CSS. ```html

``` ## Placeholder icon Use this example as a placeholder icon for the user profile when there is no custom image available. ```html

``` ## Placeholder initials This example can be used to show the initials of the user's first and last name as a placeholder when no profile picture is available. ```html

``` ## Avatar tooltip Use this example to show a tooltip when hovering over the avatar. ```html

``` ## Dot indicator Use a dot element relative to the avatar component as an indicator for the user (eg. online or offline status). ```html

``` ## Stacked Use this example if you want to stack a group of users by overlapping the avatar components. ```html

+99

``` ## Avatar text This example can be used if you want to show additional information in the form of text elements such as the user's name and join date. ```html

Jese Leos

Joined in August 2014

``` ## User dropdown Use this example if you want to show a dropdown menu when clicking on the avatar component. ```html

``` ## Sizes Choose from multiple sizing options for the avatar component from this example. ```html

```