Badges, chips & tokens

Badges show counts. Chips represent an element (entry, asset, user) with a thumbnail. Tokens are compact tag-like labels.

Entries 128 Homepage Hero news featured

<span class="badge">128</span>

<div class="chip">
  <div class="thumb"></div>
  <div class="label">Homepage Hero</div>
</div>

Note

Prefer the helper. For real elements, render chips with craft\helpers\Cp::elementChipHtml($element) (or elementCardHtml()) so thumbnails, statuses, and context menus come along automatically.