Fovea

What's inside

Prompts

HTML · 452 lines / React · 518 lines

Media

image-strip · Canvas

Hosting

cdn.orbital.supply, already in the prompt

Fonts

Familjen Grotesk · Google Fonts

HTML

One file · gsap 3.15.0

React

React 19.3.0 · gsap 3.15.0 · @gsap/react 2.1.2 · Tailwind 4.3.3 · Vite 8.3.2 · TypeScript 6.0.3

Motion

loader, infinite-carousel, drag-inertia, wheel

Tested & documented

08 October 2026

• Reproduced in Claude
• Rebuilt blind from the prompt: React and HTML
• Checked at 375, 768, 1440, 1920 px
• Spec linter: 0 errors, no generator links

How to use it

1. Claude

   Paste the HTML prompt into a new chat. You get one index.html to serve over HTTP or publish anywhere.

2. Vite + React

   Open an empty Vite + React project and paste the React prompt. It lists the exact packages; the asset URLs are already inside.

The prompt

Excerpt / 518 lines in the full prompt

# Build: "Fovea — a photography studio hero" — an endless strip of surreal photographs seen through one liquid lens

## 0. Brief

Fovea (fictional) is a photography studio in Lisbon. The hero is one black screen framed by small editorial type. Across its middle runs an endless strip of seven photographs of different proportions, seen through a single wide lens: the frame in the centre stays true (the fovea, the sharpest point of the eye) while frames near the edges swell, curve upward and split into red and blue, as if seen at the edge of vision. Behind the strip, a faint field of tiny receptors drifts outward and blinks in and out; it glows in the colour of the nearby photographs, wakes under the pointer and lights up at the edges when the strip moves. Scroll, drag, swipe, the arrow keys, a click on a side frame or the discipline index move the strip; it always settles on a frame. A short loader lights the field from the centre, then the strip glides in from the right.

The full prompt unlocks at launch.