Flying Cube Scroll
Six CSS cubes flying in from thirty thousand pixels away and settling into a spread. Every face is a real image on a preserve-3d box, so the cubes are genuinely dimensional rather than pre-rendered. Position, three rotations, and Z are each interpolated per cube across the first half of the pin, and two keep spinning a further half turn in the second. The logo blurs out, the opening headline scales and blurs away, and a second block resolves once the cubes land.
The first media company crafted for the digital first generation.
Where innovation meets precision.
BLANK unites visionary thinkers, creative architects, and analytical experts, collaborating seamlessly to transform challenges into opportunities. Together, we deliver tailored solutions that drive impact and inspire growth.
Your next section goes here
npx shadcn@latest add https://ui.aryank.space/r/flying-cube-scroll.jsonInstalls from ui.aryank.space. To add it by hand, copy the files in Usage below, or register the @compronents namespace via the docs.
| Prop | Type | Default | Description |
|---|---|---|---|
| images | string[] | 33 BLANK stills | Consumed six at a time, one per cube face, in order across the six cubes. |
| heading / outroHeading / outroBody / aboutHeading | string | BLANK copy | Copy for both phases and the closing section. |
| embedded | boolean | true | Own the scroll container so it fits a bounded box. Set false to drive it from the window scroll. |
heading / outroHeading / outroBodytextThe two headline blocks.
gsaplenis