WebberUI

Pinned Sticky Sequence

Sticky-pinned viewport that plays a frame sequence or step-by-step story in place.

ProImmersiveimmersive5 sections
See it liveSee the plans

Install

npx shadcn@latest add "https://webberui.com/r/pinned-sticky-sequence.json?t=<install token>"

The whole page lands in app/templates/pinned-sticky-sequence/. You can also use a long-lived licence key instead: set the Authorization: Bearer <key> header in the registries block of components.json — better for CI or a project several people share. What you may do with the source is in the licence terms.

Sections it ships with

Sections inside one template share the same design tokens, so swapping and reordering them keeps the colours, spacing and animation rhythm consistent. Pick and combine them in the section composer.

  1. 1

    Forge Opening Hero

    Full-screen cinematic opening: grid glow, a five-step word chain from idea to design, build, test and ship, and a scroll cue.

    hero
  2. 2

    Pinned Frame Sequence

    An in-section sticky viewport that steps frame by frame through five stages of copy, metrics and scene illustrations as you scroll.

    timeline
  3. 3

    Five-Stage Process Recap

    Five cards that collapse the whole track into one row, each listing the stage icon, name and headline figure.

    features
  4. 4

    Into the Forge Call to Action

    Closing conversion block on a pink-violet glow, with start-building-free and book-a-product-tour entry points.

    cta
  5. 5

    Forge Footer

    Brand mark and blurb, product/resources/company link columns, and a copyright and terms bar.

    footer

What you get is source code

Not an npm package, not a zip file. Once installed, the page's TypeScript source sits in your repo: edit it however you like, no runtime dependency, no expiry mechanism. Your site keeps running even if ours goes down.

Browse the other 103 templates →