About this block

Feature Spotlight Tabs compresses a product tour into three tabs on the ui tabs primitive, each pairing one paragraph of why with a small drawn panel of the actual screen, reports, flows, audience. The panel rows carry believable product detail, paused flows, live counts, which makes the tour feel like the app rather than slides about it.

Tabs are one array driving triggers, copy, and panel rows together, so adding a fourth workflow is one entry.

When to use

Reach for this block on product and tour pages where three workflows need showing but each only deserves a minute. The tabs work without JavaScript beyond the primitive, no carousel timers, the visitor drives.

A natural flow around it on a Marketing Pro page:

Before

• Hero naming the product promise these workflows deliver

After

• Product tours siblings for the deeper walkthrough
• CTA

What you can display

One strong use is your three core workflows as drawn panels. Other tab sets:

• By persona. The same product through three roles.
• By stage. Setup, daily use, and reporting views.
• By plan. What each tier's workspace actually looks like.

Tip: keep one imperfect detail in the panels, a paused flow mid edit reads truer than three green checkmarks.