three.js Starter Scene

This is the boilerplate scene Niccolò Fanton reuses as the starting point for his three.js demos. It runs on three's WebGPU renderer with an automatic WebGL fallback and has no lights at all: everything is lit by an HDRI environment map assigned to scene.environment, rotated and scaled from the control panel. Seven shapes (sphere, gem, capsule, torus, torus knot, box, extruded letter) share a single MeshPhysicalNodeMaterial built with TSL nodes, so metal, glass, rubber and bubble are the same material with different tint, roughness, transmission, thickness, IOR, clearcoat and iridescence values. The backdrop is a solid colour, a vertical gradient or the HDRI itself, each with a vignette, and the contact shadow is faked with a flat disc and a radial alpha falloff rather than a shadow map. The panel is driftpane on top of Tweakpane v4, with persisted state and presets, and stats-gl draws the FPS/CPU/GPU graphs.

Source and setup notes: the three-starter repository on GitHub. More WebGL experiments on the three.js demos hub, and the rest of the work on Niccolò Fanton's portfolio.