a 3D scroll-driven landing page

Tags
Web Development
Frontend
Technology Stack
nextjs
react
typescript
tailwind
Description
Published
March 8, 2025
Cover Image
three.js is a javascript library that lets us render 3D assets on the client.

3D Neural Network

I wanted a cool landing page so I built this neural network landing page. You progress by scrolling - which moves the ‘camera’ to various coordinates.
notion image
And it works on mobile too:
notion image
I meant to say is coordinate pairs. One coordinate for the camera position, and another coordinate to tell three.js where to look.
 

Exploration Mode

In exploration mode, you can look around instead of travelling along the defined viewport.
notion image