Lerp

Raycast

Visitraycast.com

Free previewPro opens every clip, exact specs and prompts.

Get Pro →
Intro · 1440 px · 8 s · 30 fps
Step frames · Pro

Full page · Pro

LenisNext.js 30 fps
Specs

The motion

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

06 · Ambient

Estimate

Three.js/r3f draws the diagonal red slats with a grain or dither finish

Curve Duration Stagger
Prompt

Prompt pack

The design presents a sophisticated, dark-mode interface defined by high-contrast typography and dynamic WebGL visuals. A near-black background hosts glossy, diagonal red slats with teal rims that shift lighting subtly, creating a moody yet energetic atmosphere. The aesthetic balances technical precision with organic motion, using frosted glass elements and pill-shaped buttons to soften the rigid grid. It feels modern and responsive, prioritising clarity through generous whitespace while maintaining visual interest via grainy textures and ambient light effects behind the central content.

5 prompts in Pro Generated 25 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. See Pro

Captured

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

Raycast (raycast.com): Lenis scroll.

dark · 6 effects · 1 measured · 30 fps clips

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

near-black page with a centred 64 px Inter headline over a WebGL field of glossy diagonal slats lit red with teal rims, grainy at the edges and fading to black at the sides; a floating dark nav bar and a pill with a rotating red border.

Stack as observed

Next.js (window.next) with React and CSS modules; motion: three.js r185 (window.THREE) with react-three-fiber (bundle) on a WebGL2 canvas, CSS keyframes and transitions; bundle contains Embla (carousel) and a WebGPU path; no GSAP, Lenis or video.

Techniques

Techniques on this site

Each one taught on its own page: a live demo you can tune, how it works, and the code. Dithered AI-background hero, Lerp smooth scroll, Grain and noise overlay.

More like this

Similar motion and feel.

89 % alike
89 % alike
87 % alike
87 % alike
85 % alike