Environment
Environment for Three.js & React Three Fiber
Sky, sun and moon, volumetric clouds, ocean, terrain and fog, built to work together. Clouds, ocean and terrain are lit by the sky's own sun, so changing the time of day changes the whole scene.
The elements
Sky
A physically based sky with atmospheric scattering. Turbidity, Rayleigh and Mie settings shape the colour of the air, and the sun's position drives everything else in the environment.
4 presets02Clouds
Raymarched volumetric cloud decks with a separate cirrus layer, lit by the same sun and sky as the rest of the scene.
20 presets03Ocean
Animated water with waves, reflection and refraction, lit by the scene's sky and sun.
20 presets04Terrain
Procedural landscapes rendered at any distance, with shadows from the scene's sun and haze that fades into the sky.
20 presets05Time of day
Set the hour, let it run at any speed, or sync it with the real clock. The sun and moon move, and sky, clouds, ocean and fog follow.
06Sun & Moon
The sun and moon as real light sources: size, intensity and shadows, positioned by the time of day.
07HDR
Image-based lighting from an HDR environment, with ground projection, background blur, intensity and rotation controls. Use drei's built in presets or upload your own
10 presets08Fog
Distance fog with colour, near and far controls, for depth, scale and atmosphere in a scene.