Build a parallax website from a video you attach

Gemini watches your screen recording or inspiration video and writes a buildable spec plus code for a scroll-driven parallax site.

You'll attach

Needs video

Works with

Gemini

How to use it

1. Open Gemini (gemini.google.com or Google AI Studio). Of the major assistants, it is the one that can watch an uploaded video.
2. Upload the video file (or paste a YouTube link where the prompt allows). Shorter clips give more precise results.
3. Fill in the highlighted blanks ([BRAND OR PROJECT NAME], [HEADLINE, SECTIONS AND COPY]) below, or edit them after pasting.
4. Copy the prompt, paste it into the chat and send.
5. Coding agents like Cursor or Claude Code can't watch video. Paste Gemini's spec and code into them to keep refining it in a real project.

Watch the attached video closely. It shows a website or motion design I want to recreate as a scroll-driven parallax landing page for [BRAND OR PROJECT NAME].

1. Describe what you see, section by section, with timestamps: layout, layers, what moves on scroll, speed differences between layers, colors, type and transitions.
2. Turn that into a build spec: sections in order, each layer and its scroll speed, sticky elements, breakpoints and reduced-motion behavior.
3. Write a single self-contained index.html (HTML, CSS and vanilla JS, no frameworks) that implements it. Use CSS transforms and requestAnimationFrame or scroll-driven animations, keep it at 60fps and respect prefers-reduced-motion.
4. Use placeholder images from simple gradients or SVG shapes, and list which assets I should swap in.

My content: [HEADLINE, SECTIONS AND COPY].