Cta 19 - Call to action with resource links column

Pro

A wide card pairing badge, headline, body, and dual buttons with a separated column of two large icon link rows for deeper resources.

Shadcn Cta 19 block

Component Data

  • ID:cta19
  • Access:pro
  • Created:Dec 27, 2024
  • Type:block

Cta 19 block design & features

Cta19 is a horizontal call-to-action built with Shadcn UI inside one rounded bordered shell split into primary messaging and a secondary link stack. The left side optionally shows an outline badge, then a headline and muted paragraph capped by primary and outline buttons that behave as anchors. The right side is a separate flex column with hairline separators between full-width rows, each row an entire clickable band with icon, title, and longer supporting text.

Surfaces stay flat with crisp borders and generous padding so the emphasis lands on typography and icons rather than gradients. Hover states mute the link bands slightly to signal interactivity while keeping contrast steady for the icon strokes.

This pattern is moderately structured for teams that want twin commitments beside richer explanatory hops without nesting nested accordions. The symmetry between commerce-style buttons and documentation-like destinations makes it flexible beyond one niche narrative.

Stacked vertically below large breakpoints, the separator shifts from vertical divider psychology to stacked bands separated by horizontal rules so scanning stays predictable on phones.