Cards

Social Post Card

A full social post with author header, linkified body, a media grid that adapts to one through four items, and a metrics row.

Priya Nakamura

@priyanakamura

Shipped the new @fieldbook onboarding flow tonight, three weeks of tuning down to a single afternoon setup. First cohort numbers already look great. #buildinpublic

Onboarding V2updates.fieldbook.internal

2:14 PM · Mar 3, 2026

Using Social Post Card

A full social post with author header, linkified body, a media grid that adapts to one through four items, and a metrics row.

Try the live preview with a pointer and keyboard, then check focus visibility and the narrow layout in your own page. Use the plate number or slug when asking your coding agent to fetch this component.

Props: mediaCount, verified, showMetrics, accent

Which frameworks are available?

The catalog lists these versions: react, vue, svelte, astro, html. The live preview on this page runs React.

How do I access the implementation?

The preview and component description are public. Sign in with an authorized account to open the code, framework versions and installation panel.

Connect your agent

Nearby

1816Threaded post cardCardsA social post rendered as a framed panel with a verified author, a multi-line body and one nested reply below a rule.

1769Deferred post cardCardsA post card that shows a measured placeholder shell first, then swaps in the real post, with a retryable failure state.

1544Spotlight cardCardsCards whose 1px border and surface light up around the pointer, with the highlight carrying across a row of stat tiles.

1762Anchored site previewCardsA hover preview whose side, alignment and offset can be dialled in, with a pointing arrow that tracks the anchor and flips with it when there is no room.

1841Bevel Edge Panel CardCardsA card with a one-pixel inner bevel that makes it look pressed into the page, and a frame mode that groups stacked sub-panels.

1844Bouncing Photo FanCardsA row of overlapping square photo tiles that pop in with an elastic overshoot, then shove each other aside when one is hovered.