Recreating Atmos 3D Website with React Three Fiber: Part 1 - Curved Path

Let's try to reproduce the Atmos website using threejs and React Three Fiber.

In this first part, we will build the foundation to reproduce this beautiful 3D website.

We'll prepare our plane, clouds, and the curved line representing the path the plane follows while scrolling.

At this point, the end result won't look quite close to the final result, but we need to start there and iterate to gradually make our project looking good and professional!

Need help with this tutorial? Join our Discord community!