ColorTunnel

© 1997 Christian Cohnen

A real-time color tunnel effect using pre-computed polar coordinate tables. Each pixel's angle and radius from the center are calculated once at startup; at runtime the inner loop only needs additions, bitwise masking and a palette lookup per pixel. A cycling sinus distortion warps the tunnel walls, creating an organic, pulsating fly-through.

Tunnel effects were a staple of the Amiga, Atari ST and PC demoscene. The trick of replacing expensive atan2/sqrt with a one-time lookup table made them fast enough for 68000 and early x86 hardware. This version generates its color palette procedurally — no texture image needed — producing a smooth gradient that cycles from black through green, red, white and cyan.

Since browsers no longer support Java applets, the demo below is a JavaScript/Canvas port of the original effect.

Features

Applet Code Example

<applet archive="ColorTunnel.jar"
  code="ColorTunnel.class" width="200" height="200">
</applet>

JavaScript Canvas Version

The JavaScript port uses the same algorithm — pre-computed polar tables, palette lookup and sinus distortion — but renders into an HTML5 <canvas> via ImageData.

<canvas id="game" width="300" height="300"></canvas>
<script src="colortunnel.min.js"></script>