Note: WebGL must be enabled on your browser. For security, it should be disabled as there are many exploits possible. That being said, if you want to see some not-so-impressive WebGL demos live in the browser, feel free to enable it just for this session. For added security, I have included GIFs in this page to show what they look like. You could also sandbox your browser (e.g., open in a VM) or any other isolation techniques.

Simple Animation 🔗
The simplest demo, this demonstrates the ability to manipulate vertices and colors for WebGL, and set up the WebGL context and rendering loop. Features 2D only.

Spinning Cubes 🔗
In this demo, I setup 3D geometry and send it once to the GPU. A clickable canvas allows the user to create spinning cubes on demand.

Lighting 🔗
This demo shows lighting basics, as well as creating surfaces of revolution in WebGL. An interactive canvas allows the user to see the lighting in different ways.

Animation and Textures 🔗
A figure is created using only cubes, and these cubes are then animated using external matrices/vectors. Demonstrates texturing and animation.