How it works
MeshTransmissionMaterial (drei) with a Lightformer-built <Environment> — no HDR download. The group lerps toward pointer rotation each frame.
Glass Hero
Floating transmission-glass shapes that tilt toward the cursor, lit by a procedural environment.
★ showcaseR3FdreiThree.js
Performance
Renders through the single shared <Canvas> via drei <View> — no extra WebGL context, and the render loop only runs while a view is mounted. Transmission samples = 6 on low tier, 10 otherwise; resolution scales with tier.
Accessibility & reduced motion
In reduced mode the scene renders on demand only: a static, fully lit frame with no idle motion.
Export
uniform float uThickness; // 1.2 uniform float uIor; // 1.5 uniform float uChroma; // 0.06 uniform float uRoughness; // 0.05 uniform float uTilt; // 0.4