Lerp

The Playa

Free previewPro opens every clip, exact specs and prompts.

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

Full page · Pro

Lenisthree.js 30 fps
Specs

The motion

The Playa is known for Lenis intro. Measured from frames; estimates from notes. Each fit includes its error.

04 · Ambient

Estimate

The hero canvas renders the blurred frosty image inside the notched…

Curve Duration Stagger
Prompt

Prompt pack

The design presents a clean, high-contrast interface dominated by white space and sharp black typography. Its distinctive character comes from a large hero panel featuring notched, tab-like cut-outs that reveal a soft, blurred WebGL image resembling frost or smoke. Floating frosted glass cards with pill-shaped corners overlay this background, creating depth through layering. The mood is technical yet organic, balancing rigid grid structures with fluid, ambient motion and playful pops of pale magenta.

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 home · 1440 px · home · 390 px · key pages · 1440 px · key pages · 390 px
Notes

The Playa (theplaya.solutions): Lenis intro.

light · 4 effects · 30 fps clips

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

white B2B page with a mint pill logo and black pill buttons. The hero panel has notched, tab-like cut-outs filled with a soft, blurred frosty WebGL image, with floating frosted cards (a pink countdown tile, a notification-style "Next Best Games" card).

Stack as observed

Nuxt (Vue); motion: Lenis (html.lenis), bundle contains GSAP + ScrollTrigger, three.js r157 (__THREE__, one webgl2 hero canvas), AOS-style reveals (aos-init sections, 8 data-scroll hooks), split-line text (15 elements), about 27 small 2d canvases; Vue CSS transitions for the counter and card stack.

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, Liquid Glass dock.

More like this

Similar motion and feel.