COMPONENTS · CONTENT CARD

Content Card

DESCRIPTION

A content card is a container that groups related information into a distinct unit, making content easier to identify, scan, and interact with.

PLAYGROUND MODE

A compact, single-row card pairing a bold label with a fixed-size media or icon slot — for list and media-row layouts.

Partially implemented

PlaygroundCurrent theme

Label

TOKENS & TYPOGRAPHY

Implementation bindings

Bordercolor/text/muted · 8% opacity

LabelNunito Sans · 18 px · Bold 700

Media size69 × 38 px

Media radius8 px

Corner radiusradius/16 · 16 px

Elevationshadow-xs · 0 1px 1px rgba(25,25,28,.04)

COMPONENT STRUCTURE

01Label · Editable text, truncates on overflow

02Media · Optional fixed 69×38 px thumbnail

The Figma source page for this component is mostly unpopulated — no anatomy diagram or incorrect-example counterpart has been authored yet. This implementation covers the single populated example.