Lerp

Beacon

Free previewPro opens every clip, exact specs and prompts.

Get Pro →
Scroll · 1440 px · 11 s · 30 fps
Step frames · Pro

Full page · Pro

GSAPLenis 30 fps
Specs

The motion

Beacon is known for Lenis scroll. Measured from frames; estimates from notes. Each fit includes its error.

06 · Ambient

Estimate

The hero pictogram cycles through small scenes (hammer, crane, flag,…

Curve Duration Stagger
Prompt

Prompt pack

The site presents a bold, industrial aesthetic defined by high-contrast colour blocking and sharp geometric forms. A massive red wordmark anchors the bottom of the viewport, supporting flat line-art illustrations of construction scenes within a triangular beam. The mood is authoritative yet warm, achieved through a pale cream background that softens the starkness of the near-black text and bright red accents. Square corners and heavy typography create a structured, serious tone, while subtle animations of the pictograms add a layer of playful mechanical movement to the static layout.

5 prompts in Pro Generated 24 Sep 2026

  • Recreate this site's feelEverything: look, layout, type, colour, motion and libraries, in one prompt.
  • Just the scroll feelSmoothing, what moves with scroll, pinned sections.
  • Just the introHow the page enters: sequence, curve, duration, stagger.
  • Just the hoversLinks, buttons and cursor: timings from the live CSS.
  • Just the type and colourFamilies, scale, weights, tracking and the palette with roles.

Pro opens every prompt with its measured values, and the tokens they are built from.

Unlock prompts with Pro

US$60/year or US$8/month. Cancel anytime.

Record

Capture record

Savedon 24 Sep 2026. Full pages, stills and key frames.

Pro opens the rest of the record: the whole page at each viewport, the key frames of every clip, and 2 key pages. See Pro

Captured

  1. 24 Sep 2026 Shown home · 1440 px · home · 390 px · key pages · 1440 px · key pages · 390 px
Notes

Beacon (beaconholdings.com): Lenis scroll.

light · 6 effects · 1 measured · 30 fps clips

Motion
Intro, Scroll, Hover, Page transition, Ambient
Libraries
GSAP, Lenis, Motion, Next.js
Footage
1 clip, frame-stepped 30 fps
Captured
24 Sep 2026

warm cream page in signal red and navy. A small serif headline ("Bringing AI to the real economy") sits above a huge heavy red "Beacon" wordmark across the bottom, with a red light-beam triangle rising from it and a tiny pictogram worker standing on the letters. One custom serif throughout and flat geometric illustrations.

Stack as observed

Next.js (window.next) with React and Tailwind classes; motion: WAAPI (Element.animate opacity and clip-path, probably Motion/Framer Motion), bundle contains Lottie; no canvas, video, GSAP or Lenis.

Techniques

Techniques on this site

Each one taught on its own page: a live demo you can tune, how it works, and the code. Lerp smooth scroll.

More like this

Similar motion and feel.

89 % alike
89 % alike
88 % alike
88 % alike
88 % alike