npm
Banners

TopRibbon

Small ribbon centered over a card's top edge.

Best value
<div style={{ position: "relative" }}>
  <TopRibbon><Ribbon size="small">Best value</Ribbon></TopRibbon>
  <Panel tone="paper">…</Panel>
</div>

Centers a small ribbon over a card's top edge, the classic featured-offer crown.