Feature 207 - Numbered three-step workflow with separators

Pro

A vertical workflow with a small overline, headline, and three numbered steps separated by lines; each step uses a two-column row on medium screens and up for title and body text.

Shadcn Feature 207 block

Component Data

  • ID:feature207
  • Access:pro
  • Created:Mar 30, 2025
  • Type:block

Feature 207 block design & features

This block is a simple timeline-style workflow built with Shadcn UI separators and typography. A small uppercase label sits above a large title, then three steps appear in sequence. Each step shows a monospace index, a step title, and a muted paragraph in a two-column alignment from the medium breakpoint upward.

Visually the section relies on hairline separators between steps, restrained type weights, and plenty of vertical padding. Numbers stay muted so the headings carry the emphasis. There is no imagery or ornament beyond the dividers, which keeps the focus on reading order.

Overall it feels minimal and editorial, closer to documentation or a service outline than a flashy promo strip. The sample copy follows a photography workflow, but the structure works for any three-part process. This is a straightforward, low-complexity block that mainly needs solid step titles and explanations.

On narrow screens the step label and copy stack naturally while separators keep each phase distinct.