Morph Scroll Hero

Give your site an opening people remember. Capsule Morph Hero Pro opens your hero image out of a small capsule into a full-screen frame. As visitors scroll, it morphs back into a capsule while rows of image capsules sweep across the screen. It ends with a lit 3D-style centre capsule and a closing line, then the page continues.

Perfect for product brands, studios, agencies and portfolios.

The animation

- Cinematic intro: the hero image opens out of a capsule as the headline rises in

- Scroll morph: the frame shrinks into a capsule as capsule rows sweep past like a marquee

- Finale: a 3D-style centre capsule tilts aside and your closing line slides in

- End Hold keeps the finished finale on screen before the next section arrives

Features

- Hero image, centre capsule for your logo or product, and up to 12 marquee images

- Readability gradient so your heading stays clear on any photo

- Editable two-line headline, primary button, text link and scroll cue

- Separate colours for the heading, accent, finale line, buttons and capsules

- Fluid text that scales with the screen, or your own font sizes

- Scroll length, smoothing and optional smooth scrolling

- Canvas preview slider to scrub the whole animation while you design

Built right

- Pins itself and creates its own scroll length: just set Width to Fill

- Responsive on desktop, tablet and phone

- Respects reduced motion and pauses work when not needed

- No external scripts or dependencies

Setup takes about 3 minutes: add your images, write your headline and publish.