WebGPU Path Tracer
A real Monte Carlo path tracer, rendering in a browser tab. Drag to orbit and the image accumulates samples in real time — true global illumination, soft shadows, mirror reflections and glass. Nothing is uploaded; it all runs on your own graphics card.
⚡ 100% on-device — your GPU does every ray, no serverHow does this run in a browser?
For a long time, ray tracing meant a render farm and a long wait. This page does it live on your own machine using WebGPU, the new browser standard for talking to your graphics card directly. The whole renderer is a pair of shader programs compiled and run on your GPU. There is no server in the loop, no upload, and no install — once the page loads you could pull the network cable and it would keep rendering.
What a path tracer actually does
For every pixel, the GPU fires a ray out of the camera into the scene. When that ray hits a surface it picks a new random direction to bounce, and keeps bouncing until it either reaches a light or runs out of bounces. Doing this honestly is what gives you the things that are painful to fake: colour bleeding between surfaces, soft shadows with real penumbra, mirrors that reflect each other, and glass that bends light through refraction. The trade is noise — a single ray per pixel is a rough guess.
Why it starts grainy and cleans up
This is Monte Carlo rendering. Each frame adds one fresh random sample per pixel and averages it into everything drawn before, so the picture converges from speckled to smooth the longer you hold still. Move the camera and accumulation restarts, which is why it looks noisy while you drag and then resolves the moment you let go. The sample counter in the top-left tells you how many frames have been averaged.
Try this
Switch the centre sphere to glass and watch it refract the room behind it, then to metal to turn it into a mirror that reflects the other spheres. Open the Cornell box scene to see the classic global-illumination test — notice how the red and green walls tint the white surfaces near them, light that no direct lamp is casting. Push light bounces up for richer indirect light, or down for speed.
Is this real ray tracing or a pre-rendered video?
Real. Every frame is computed on your GPU from the current camera and settings. Change anything and it re-renders from scratch, which a video could not do.
Does anything get uploaded?
No. There is no backend at all. The renderer is pure client-side WebGPU, so nothing about the scene or your machine leaves the page.
It says WebGPU is unavailable — why?
WebGPU needs a recent browser and a supported GPU. Use the latest Chrome or Edge on desktop, or Safari 18+. On some machines you may need to enable hardware acceleration in browser settings.
Why is it noisy while I move the camera?
Because accumulation resets on any change. A single sample per pixel is grainy by nature; the image is meant to be read after you stop moving and let the frames pile up.
I build things like this every day.
Senior full-stack engineer, comfortable from GPU shaders to product, available for senior or contract work, fully remote. See the rest of the lab or get in touch.