Feature 249 - Aurora headline with scroll-scaled media card

Pro

A stacked section with gradient-styled headline text, supporting copy, and a scroll-driven card that scales and shifts above a large image or preview.

Shadcn Feature 249 block

Component Data

  • ID:feature249
  • Access:pro
  • Created:May 4, 2025
  • Type:block

Feature 249 block design & features

Feature249 is a scroll-stage hero-adjacent block that combines Magic UI aurora text with shadcn/ui framing. Keywords in the title pick up a moving gradient while the rest of the stack sets context underneath. Below the text, a card or device frame tracks scroll progress with scale, translation, or rotation so the media feels embedded in the page motion.

The lower region reads as a hero image or product mock under a floating panel, producing a parallax-like effect without a separate full-screen photo banner. Color sits mostly in the type treatment and subtle backgrounds so the photograph or UI shot stays legible.

This is one of the more elaborate feature-scroll patterns because it coordinates headline styling, body copy, and a transform-heavy media card. You need a strong still or render for the base layer and concise headline text that benefits from gradient emphasis on one or two words.

Mobile layouts keep the same scroll coupling but with smaller transforms so the card does not clip horizontal edges or obscure copy.