ABYSS — A Descent Into the Deep Ocean
Scroll down and you sink: a depth gauge counts to 6,000 metres while the light fades, the marine snow thickens and the water starts to glow.
A cinematic one-page site for a made-up deep-ocean research institute. It opens on a depth counter that runs to 4,000 metres, then a giant bioluminescent jellyfish over a lone diver, with drifting marine snow and shafts of surface light drawn live in WebGL over the photograph. The whole page is the descent: a gauge on the right reads depth, zone and pressure as you scroll, the light shafts fade out by the midnight zone, and glowing plankton takes over from the snow. Each zone (twilight, midnight, the abyss) opens from a small porthole to the full screen, then come the research numbers counting up, the submersible with hotspots that light up as you arrive, and three patron tiers. One HTML file with five generated photographs beside it; GSAP and ScrollTrigger from a CDN and nothing to install.
Paste the prompt intoClaude CodeCursorAntigravityWindsurfLovableBoltv0
What's in the source
7 files — one self-contained page that opens in a browser, with the prompt that made it.
br-abyss-deep-ocean/ ├─ assets/ 5 files ├─ index.html └─ … 1 more
How to run this
Nothing to install and nothing to configure. Works in any modern browser on Windows, macOS and Linux.
- Built with
- Single HTML file
- Requires
- A modern browser
- 1. Unzip the download.
- 2. Double-click index.html. It opens in your browser and runs. To serve it instead (some browsers want a server), run
npx serve .in the folder and openhttp://localhost:3000.
Note — GSAP and ScrollTrigger load from the cdnjs CDN and the typefaces from Google Fonts, so the first load needs an internet connection. The photographs are in the assets folder beside index.html; keep the two together. The water is drawn in WebGL, which every current browser has. Upload index.html and assets/ to any static host and it is live.
Questions about ABYSS
Who is ABYSS for?
ABYSS is for nonprofits, and for the designers, developers and agencies who build their sites. It's a foundation rather than a site for one business: ask your AI to make it about yours and it rewrites the copy, colours and images around the same build.
What is ABYSS built with?
ABYSS is built with GSAP, HTML/CSS/JS and raw WebGL. The source is a single HTML file: open it in a browser and it runs, with no build step. The prompt is written for coding agents such as Claude Code, Cursor and Antigravity.
Can I use ABYSS for a client project?
Yes. Every purchase includes a commercial licence: use it in your own projects and in work you deliver to clients, including paid client work, change and rebrand it, and publish the result with no credit needed. What you can't do is resell, share or republish the prompt or the source files themselves.
Should I buy the prompt or the source?
The prompt is the written brief that built the design: paste it into a coding agent such as Claude Code, Cursor or Antigravity and it builds the site on your computer, which you then refine. The source is the finished project itself, ready to run exactly as the preview shows. The source always includes the prompt.
Will the prompt give me exactly the preview?
Not exactly, and that's expected. A prompt is a starting point: AI output varies between tools and between runs, so plan to refine spacing, timing and copy. The source pack is the preview itself, finished and running.
Can I get a refund?
Single designs are final once delivered, unless something is wrong on our side: a broken or empty download, a pack that isn't what its page describes, or a double charge. Then email support@brandmotion.in with your receipt and we fix it or refund it. The full terms are on the refunds page.
More like this
Browse the store →
PremiumMithaas & Co. — The Diwali Box That Opens Itself
Scroll and a gold gift box unties its ribbon, lifts its lid and lets the mithai rise — then six sweets burst apart and you build your own Diwali box.
PremiumBR-ICE — Real Milk, Zero Sugar, Blown Apart
Scroll and the pint cracks open while 3D sprinkles fly out of the screen — then six cones explode on their own colours and you build your own in 3D.
PremiumSOLUNE — Gold & Silver, Made by Fire, Kept for Life
A single drop of molten gold falls, spins into a ring and takes its diamond as you scroll — then flip the sun to the moon and it turns to silver.
