Menu
Overview
General
ButtonBadgeAvatarBrand lockupLayout
ContainerGrid & RowSurface & text utilitiesApp shellData Display
CardTableStatsBulletsLeadersLogo wallCollapse & DisclosureValue chainFeedback
AlertModalForms
Field & InputLead form & CTA rowNavigation
NavTheming
Product themesData Display
Leaders
Clickable people cards with round avatar, name, and role.
.leaders · .leader
<div class="leaders" style="max-width:520px">
<button class="leader">
<span class="avatar">RK</span>
<span><b>Ricardos Khoury</b><span>President & CEO · Founder</span></span>
</button>
<button class="leader">
<span class="avatar">TH</span>
<span><b>Thorsten Hellwig</b><span>Chief Operating Officer</span></span>
</button>
<button class="leader">
<span class="avatar">JG</span>
<span><b>Jim Geovedi</b><span>Chief Technology Officer</span></span>
</button>
</div>
Usage
- Each card is a real
<button>that opens a bio dialog, so it uses the standard clickable lift. - Round photo on white with a thin ring where a headshot exists; monogram avatar is the fallback.