Sky shader for Three.js & React Three Fiber

The sky in 3DRise is a physically based daylight sky that fills the whole background of a scene. It simulates how sunlight scatters through the air: deep blue overhead, paler toward the horizon, a bright glow around the sun, and warm, hazy colours when the sun sits low. Because it is calculated rather than painted, it works from every camera angle and changes smoothly as the sun moves.

What the sky controls

The sky is more than a backdrop. What it draws is shared with the rest of the environment: the sunlight that casts the shadows, the volumetric clouds, the ocean and the terrain are all lit by the same sun and the same air. The sky is also captured as the scene's reflection environment, so glossy and metallic materials reflect it. Move the sun and the whole scene follows.

Settings

The sky panel has two tabs. Atmosphere:

• Turbidity: how much haze is in the air. Low values give a deep, clean blue; high values a milky sky and a softer sun.
• Rayleigh: scattering by the air itself, which is what makes the sky blue and sunsets red. Raise it for richer colour.
• Mie Coefficient: scattering by larger particles such as dust and droplets, which creates the bright glow around the sun.
• Mie Directional G: how tightly that glow hugs the sun.

Sun:

• Elevation: the sun's height above the horizon, from straight overhead to below it for dusk and night.
• Azimuth: the compass direction of the sun.

Four presets give quick starting points: Initial, Day, Sunset and Night. Every atmosphere setting can also be keyframed on the timeline or tied to the cursor, so the light can shift as a visitor scrolls or moves the mouse.

Sky and time of day

When time of day is switched on, the clock takes over the sun's position and the sky settings become the look of the middle of the day. As the sun goes down the sky blends on its own through golden hour, twilight and night, and darkens properly after sunset instead of stopping at a flat grey.

The night sky has its own stars, with settings for Brightness, Count, Size, Twinkle, Milky Way (which gathers part of the stars into a dense band arching across the sky) and Colour Spread (from all-white stars to a mix of blue and orange ones). With the clock running the stars come out only after dark, fade toward the horizon and slowly turn across the sky through the night. The moon and the light it gives are covered under sun and moon.

When to use it

Use the sky for outdoor scenes, product shots in natural light, architecture and landscapes, and any scene where the light should feel like a real hour of the day. For a photographic backdrop with real-world reflections, an HDR environment is the better fit. Add volumetric clouds for a fuller sky.