Avatar
Default
<figure class="avatar"><img src="avatar.jpg" class="rounded-circle" alt="avatar"></figure>Sizes
<figure class="avatar avatar-xl"><img src="avatar.jpg" class="rounded-circle" alt="avatar"></figure><figure class="avatar avatar-lg"><img src="avatar.jpg" class="rounded-circle" alt="avatar"></figure><figure class="avatar"><img src="avatar.jpg" class="rounded-circle" alt="avatar"></figure><figure class="avatar avatar-sm"><img src="avatar.jpg" class="rounded-circle" alt="avatar"></figure>Avatar text placeholders
<figure class="avatar"><span class="avatar-title rounded-circle">A</span></figure>Avatar text sizes
<figure class="avatar avatar-xl"><span class="avatar-title rounded-circle">A</span></figure><figure class="avatar avatar-lg"><span class="avatar-title rounded-circle">B</span></figure><figure class="avatar"><span class="avatar-title rounded-circle">C</span></figure><figure class="avatar avatar-sm"><span class="avatar-title rounded-circle">D</span></figure>Avatar with link
<figure class="avatar"><a href="#"><span class="avatar-title rounded-circle">A</span></a></figure>Colorful avatars
<figure class="avatar avatar-xl"><span class="avatar-title bg-primary rounded-circle">A</span></figure><figure class="avatar avatar-lg"><span class="avatar-title bg-info rounded-circle">B</span></figure><figure class="avatar"><span class="avatar-title bg-success rounded-circle">C</span></figure><figure class="avatar avatar-sm"><span class="avatar-title bg-danger rounded-circle">D</span></figure>Avatar states
<figure class="avatar avatar-xl avatar-state-warning"><img src="avatar.jpg" class="rounded-circle" alt="avatar"></figure><figure class="avatar avatar-lg avatar-state-success"><img src="avatar.jpg" class="rounded-circle" alt="avatar"></figure><figure class="avatar avatar-state-danger"><img src="avatar.jpg" class="rounded-circle" alt="avatar"></figure><figure class="avatar avatar-sm avatar-state-secondary"><img src="avatar.jpg" class="rounded-circle" alt="avatar"></figure>Avatar shapes
<figure class="avatar"><img src="avatar.jpg" alt="avatar"></figure><figure class="avatar"><img src="avatar.jpg" class="rounded" alt="avatar"></figure><figure class="avatar"><img src="avatar.jpg" class="rounded-circle" alt="avatar"></figure>Avatar group
<div class="avatar-group"><figure class="avatar"><span class="avatar-title bg-success rounded-circle">E</span></figure><figure class="avatar"><img src="avatar.jpg" class="rounded-circle" alt="avatar"></figure><figure class="avatar"><span class="avatar-title bg-danger rounded-circle">S</span></figure><figure class="avatar"><img src="avatar.jpg" class="rounded-circle" alt="avatar"></figure><figure class="avatar"><span class="avatar-title bg-primary rounded-circle">C</span></figure></div>