Interactive Cornell Box Raytracer

Real-time path tracing in your browser. Inspired by Ray Tracing: The Rest of Your Life

Render Progress: 0%
Render Time: 0.0s
Status: Ready

Rendering Parameters

Higher values = better quality, slower render

Maximum number of ray bounces

Camera Settings

Scene Objects

Box Materials

Presets

Shortcuts: R start render, X stop render, P save image

About This Raytracer

This is a browser-based implementation of a Cornell box raytracer, inspired by Peter Shirley's "Ray Tracing: The Rest of Your Life" book series. The Cornell box is a classic test scene in computer graphics used to validate rendering algorithms.

The implementation uses Monte Carlo path tracing with importance sampling to simulate realistic light transport. Each pixel traces multiple rays through the scene, accumulating light samples to produce the final image.

Features

  • Real-time progressive rendering
  • Multiple material types (Lambertian, Metal, Glass)
  • Adjustable camera parameters
  • Customizable light intensity
  • Configurable sample counts and ray depths
  • Interactive scene controls

Technical Details

  • Rendering Algorithm: Monte Carlo Path Tracing
  • Language: Pure JavaScript (ES6+)
  • Canvas API: HTML5 Canvas for pixel manipulation
  • Materials: Lambertian diffuse, Metal with roughness, Dielectric (glass)
  • Scene: Classic Cornell box with colored walls and area light