Scroll to the bottom of the sea

The best scroll mechanic ever shipped is also the simplest: down means down.

Deep Sea, from Neal Agarwal's toy factory of a website, maps your scroll wheel to ocean depth. Sea level at the top of the page; the Mariana Trench nearly eleven thousand meters later. Creatures appear at their real depths as you sink. Sunlight gives out around 200 meters. The last whale drops away. Somewhere past 8,000 meters it is just you, a snailfish, and the growing suspicion that your mouse wheel was not built for this descent's length.

The research is the placement

Each animal sits at roughly the deepest point its species is known to reach, which is how the December 2019 release opens with a polar bear paddling at 25 meters and works down through a wolf eel at 220 and a firefly squid at 375. Keep sinking and an elephant seal turns up past 2,300 meters. That number reads like a typo. The 703-point Hacker News thread kept stopping to double-check it, and it holds: elephant seals commute to depths no air-breathing mammal has any business visiting.

The floor itself is pinned to a real survey mark. The Mariana Trench's deepest point, the Challenger Deep, was measured in a 2021 study with direct pressure sensors at 10,935 meters, give or take six. Your scroll wheel covers all of it. Give or take six.

The page has since been viewed more than ten million times and now plays in actual aquariums, which may make it the most exhibited scrollbar in history.

The build is restraint

Agarwal is a computer science graduate who has run neal.fun as a full-time workshop of browser toys since 2017. He has never published a technical writeup of this piece; I went looking. The page itself also refuses to answer anything that is not a real browser, so I checked the front door instead: the neal.fun homepage source ships Nuxt bundles, the application framework built on Vue. Ordinary web plumbing, in other words. No engine, no tricks a working web developer does not already own.

The closest thing to a blueprint on record is his December 2019 interview with Uses This, given the same month Deep Sea shipped. The workshop it describes is almost aggressively normal: a 15-inch MacBook Pro, VS Code, Chrome, a React and Node stack hosted on Netlify, Photoshop increasingly swapped for the free in-browser Photopea. His stated dream setup is "the fewest things possible". The man who built an eleven-kilometer page wants an invisible desk.

Nothing in that toolkit explains the page, and that is the finding. The scrollytelling arms race has mostly assumed that awe scales with WebGL budget. The most awe-struck page I know was assembled from the same parts as a to-do app, plus patience and what must have been a serious marine-biology reading list.

The receipt is what he left out. No WebGL, no physics engine, no sound design pounding the drama. Illustrations, depth markers, and distance. The awe is generated entirely by honest scale: the page is long because the ocean is deep, and your thumb gets tired because the trench is far. The medium is the message and the message is that you are very, very small.

In the Glitch interview above, Agarwal describes his method as getting a minimal version working early to see whether an idea deserves to exist, then treating the rest as experimentation and alchemy. This one deserved to exist.

That is the craft lesson for every scrolljacking landing page that fights your input to force a moment: this page hijacks nothing. It just tells the truth at one meter per meter, and the truth happens to take four minutes to fall through.

The workshop is still open, too. When the XOXO festival ran its final edition in Portland in August 2024, Agarwal was on the Art+Code demo floor showing neal.fun in person: a Friday afternoon block run with Glitch, short talks on the Park Stage and hands-on demos beside them, billed as creative code and other internet weirdness. One table among the internet artists the festival went out on. Seven years in, the site is still something he demos by hand.

The genre this page perfected

Deep Sea is the best of a small genre I think of as honest-scale pages: sites that convert a true number into physical distance and make your hands do the measuring. The rule of the genre is that the number has to survive contact with your body, your wrist, your patience, your sense of how long a page is allowed to be. The other masterworks each pick a different axis.

• If the Moon Were Only 1 Pixel, Josh Worth's 2014 solar system, scrolls sideways at a scale where the Moon is a single pixel. Printed at 300 pixels per inch the map would run about 475 feet, a football field and a half of mostly nothing, which is the point: as the interstitial text keeps telling you, most of space is just space.
• Scale of the Universe, begun by Cary Huang in the Flash era and since remastered by a small team credited on the site, trades the scroll for a zoom slider that sweeps from the subatomic out past the galaxies, with every object on the way clickable. It compresses where Deep Sea refuses to, and the two make a matched pair: one page for the size of everything, one page for the depth of one specific thing.
• And WOAH has already fallen into the pixel floor that never stops growing, which applies the same trick to a fictional space and still produces the same vertigo.

Deep Sea remains the purest of them because its number is the page. Nothing is compressed, nothing is logarithmic, and there is no slider to rescue your wrist. One meter of ocean is one meter of ocean, and the page makes you pay for every one of the 10,935.

Where this path starts

If scroll-as-story is the technique you want to steal, The Pudding keeps a working guide to implementing scrollytelling that compares six libraries with running code. It is the clearest trailhead I know for pages shaped like this one. If you want to skip the comparison shopping, the library I would reach for first is Scrollama, 6,000 stars, and its design explains itself in one line: it watches for step elements crossing a viewport threshold with IntersectionObserver and fires a callback, instead of drinking from the scroll-event firehose the way the genre's early pages did. That is the entire machinery Deep Sea needs: elements, thresholds, and the patience to put the right fish at the right pixel. And WOAH's shelf holds one more piece that turns a dataset into physical space you move through: the whole planet drawn as columns of people.

Go sink. Say hi to the anglerfish around 1,600 for me.