Feature 113 - Icon tabs with muted split panels

Pro

Outline badge and short hero copy introduce three tabs (labels such as Speed and Flexible) whose panels repeat a two-column split with inner badge, large heading, paragraph, icon-bearing primary button, and rounded placeholder image inside muted rounded framing.

Shadcn Feature 113 block

Component Data

  • ID:feature113
  • Access:pro
  • Created:Oct 16, 2024
  • Type:block

Feature 113 block design & features

Feature113 wraps a tabbed marketing flow in Shadcn UI components. The section heading sits in a centered container with outline badge, condensed title, and muted sentence. Tabs align centered below with icons hidden until small breakpoints widen, giving compact phones text-only triggers. Each tab state renders inside a muted rounded rectangle with generous padding: left column stacks outline badge, oversized heading, muted paragraph, and a large button paired with a contextual Lucide icon; right column shows a capped-height rounded image.

Panels reuse the same scaffolding across tabs so swapping content feels predictable. Borders stay minimal, leaning on background tint separation and typographic scale for hierarchy.

Structurally this matches Feature108’s family of tabbed promos but anchors icons inside triggers differently and fixes image height with max constraints. Expect moderate authoring overhead to keep three narratives aligned tonally.

Layouts compress to a single column before widening again, preserving the muted wrapper around each tab’s content for continuity.