View on GitHub

Avatar

Avatar component

On this page

Our own content

<div class="avatar-example" data-bs-ride="avatar">
    <div class="avatar-lg d-inline-block position-relative">
        <img src="..." class="rounded-circle avatar-img" alt="...">
        <img src="..." class="rounded-circle user-active position-absolute bottom-10 end-0" alt="...">
    <div>
</div>

<div class="avatar-example" data-bs-ride="avatar">
    <div class="avatar d-inline-block position-relative">
        <img src="..." class="rounded-circle avatar-img" alt="...">
        <img src="..." class="rounded-circle user-active position-absolute bottom-10 end-0" alt="...">
    <div>
</div>

<div class="avatar-example" data-bs-ride="avatar">
    <div class="avatar-sm d-inline-block position-relative">
        <img src="..." class="rounded-circle avatar-img" alt="...">
        <img src="..." class="rounded-circle user-active position-absolute bottom-10 end-0" alt="...">
    <div>
</div>

<div class="avatar-example" data-bs-ride="avatar">
    <div class="avatar-xs d-inline-block position-relative">
        <img src="..." class="rounded-circle avatar-img" alt="...">
        <img src="..." class="rounded-circle user-active position-absolute bottom-10 end-0" alt="...">
    <div>
</div>