Orrin & Hale — Type-led Brand Agency
A light, type-led agency landing page: the studio name fills the first screen and squashes with scroll speed, then six pinned case panels letter each client's SVG wordmark beside its photo, with a hover/slider weight axis.
- Section Templates
- gsap
- scrolltrigger
- splittext
- svg
- expert
- medium perf
- mobile: full
- reduced-motion ✓
AI prompt
Recreate this effect with any AI tool
Paste into Claude, Cursor, v0, Lovable or Bolt. 2987 words of exact values — rewritten live as you tune the Playground.
Prompts are for subscribers
Subscribe to copy this prompt in every format, rewritten live to match your Playground settings.
Loading prompt…
Couldn’t load the prompt
Check your connection and try again.
Source
Full source code
Source code is for subscribers
Subscribe to read, copy and download the full HTML, CSS and JavaScript of this demo.
Loading source code…
Couldn’t load the source code
Check your connection and try again.
WebGL Product Launch Template
A full light-palette launch page for an invented smart speaker: a procedural Three.js model on a drag-to-turn turntable, a pinned scroll that turns and opens it into four parts with leader-line callouts, specs, colourways, sizes, reviews, pre-order and FAQ.
- gsap
- scrolltrigger
- splittext
- threejs
WebGL Halvard Glassworks Template
A light landing page for an invented Norwegian glass studio: a Three.js glass float fills with clipped, sloshing fjord water to today's tide as you scroll, a draggable tide clock refills it hour by hour, then shop, stages, pricing ticket and FAQ.
- gsap
- scrolltrigger
- splittext
- threejs
medium Kirifune — Onsen Ryokan
A light landing page for an invented onsen ryokan: each section is one of the town's seven baths and presses its vermilion stamp onto a pinned bath pass, which flips to show the route at the seventh. Live arrival-time bath planner.
- gsap
- scrolltrigger
- splittext
- svg
WebGL Motion Designer Portfolio Template: Vetrel
Motion designer portfolio template for a Lisbon 3D artist: a plain hero headline and CTA, her name set edge to edge with a frame that swaps places with its letters, and colour-gel stills that flow under the pointer.
- gsap
- scrolltrigger
- splittext
- threejs