Cross Reveal Scroll

A pinned scroll sequence that resolves onto a single white cross. As you scroll it rotates a full turn, its two bars widen from thin slits into solid quadrants, drifts to center, then scales up more than tenfold to wipe the screen and reveal the closing statement. GSAP ScrollTrigger with Lenis.

Component

Symphonia

Motion

Stills

A studio built on tempo. We shape moving identities and still frames that hold their nerve, letting rhythm decide what the eye lands on first.

Every project resolves to a single mark: the moment the motion settles and the frame is finally still.

Install

npx shadcn@latest add @compronents/cross-reveal-scroll

Installs from ui.aryank.space. Needs a registry token and a one-time @compronents entry in components.json. The docs walk through both.

Files

Checking access…

API

Prop	Type	Default	Description
brand / headerRows / intro / outro	string / [string, string] / string / string	BLANK editorial copy	Hero wordmark, banner rows, paragraph, and closing line.
images / heroImage	[string, string, string, string] / string	Five BLANK-hosted images	Four-up image strip and the hero backdrop.
embedded	boolean	true	Own the scroll container; set false to ride the window scroll.

Customize

brand / headerRows / outrotext

Hero wordmark, the two banner rows, and closing line.

intro / imagestext

Editorial paragraph and the four-up image strip.

heroImageasset-url

Fullscreen hero backdrop.

Dependencies

gsaplenis