{"name":"3d retro graphics","url":"https://3d-retro.com","license":"CC0-1.0","license_url":"https://creativecommons.org/publicdomain/zero/1.0/","description":"3d retro graphics is a free library of browser experiments. Each copies as a single HTML file (WebGL 1 or Canvas 2D) and is licensed CC0 1.0.","llms_txt":"https://3d-retro.com/llms.txt","llms_full":"https://3d-retro.com/llms-full.txt","openapi":"https://3d-retro.com/openapi.yaml","sitemap":"https://3d-retro.com/sitemap.xml","about":"https://3d-retro.com/about","contact":"mail@3d-retro.com","sections":{"historical":{"title":"Retro techniques","note":"Recreations of documented techniques and period looks. Each page names its reference, or says plainly that it is an interpretation of a style rather than a copy of one original."},"modern":{"title":"Modern experiments","note":"Made in 2026 with the same single-file, retro-styled rendering. These illustrate recent mathematics and are not historical effects."}},"count":31,"experiments":[{"slug":"plasma","number":"01","title":"Plasma","era":"PC demoscene · early 1990s","section":"historical","provenance":"interpretation","reference":null,"summary":"Color-field oscillator running as a fullscreen fragment shader.","description":"The classic PC demoscene plasma: a sum of sine fields in the plane, sampled through a cycling palette. The 1990s versions added precomputed sine tables and drew through a 256-colour palette because a 386 could not afford a sine per pixel. This one is a modern reading of the look: a single WebGL 1 fragment shader evaluates about nine sines per pixel. Two triangles, a time uniform, no textures. Drop the file on a page and it fills the window.","apis":["WebGL 1","GLSL ES 1.0","requestAnimationFrame","matchMedia"],"tags":["shader","demoscene"],"hasGlsl":true,"interaction":null,"url":"https://3d-retro.com/experiments/plasma","example_url":"https://3d-retro.com/examples/plasma.html","api_url":"https://3d-retro.com/api/v1/experiments/plasma"},{"slug":"starfield","number":"02","title":"Retro 3d starfield","era":"Screensaver and demo staple · c. 1992","section":"historical","provenance":"interpretation","reference":null,"summary":"Perspective starfield that stretches into a hyperspace tunnel.","description":"700 points in a unit cube, projected with a 1/z divide. Depth is decremented each frame; when a star passes the camera it is recycled at the far plane. Motion blur is a cheap trail fade on the 2D canvas. The look is the one every 1990s screensaver and demo intro had, Windows 3.1's Starfield Simulation included; no single original is reproduced. Move the pointer to shift the vanishing point.","apis":["Canvas 2D","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["canvas","particles"],"hasGlsl":false,"interaction":"Move the pointer over the preview to shift the vanishing point.","url":"https://3d-retro.com/experiments/starfield","example_url":"https://3d-retro.com/examples/starfield.html","api_url":"https://3d-retro.com/api/v1/experiments/starfield"},{"slug":"lowpoly","number":"03","title":"Retro torus","era":"Flat-shaded workstation demo · c. 1990","section":"historical","provenance":"interpretation","reference":null,"summary":"Flat-shaded torus, wire overlay, and a ground grid. Drag to orbit.","description":"A torus tessellated into chunky triangles with per-face normals, lit by a mint key and a cool fill, over a ground grid. Edges are drawn as a second line pass. It is the flat-shaded, gridded-floor look of early 1990s graphics-workstation demos in general, not a port of any one demo reel. Matrix math is inline, no three.js. Drag to orbit. It auto-rotates until you take over.","apis":["WebGL 1","GLSL ES 1.0","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["webgl","3d"],"hasGlsl":true,"interaction":"Drag on the preview to orbit. Auto-rotation stops after the first drag.","url":"https://3d-retro.com/experiments/lowpoly","example_url":"https://3d-retro.com/examples/lowpoly.html","api_url":"https://3d-retro.com/api/v1/experiments/lowpoly"},{"slug":"metaballs","number":"04","title":"Chrome blobs","era":"Blinn · 1982","section":"historical","provenance":"documented","reference":{"label":"J. F. Blinn, \"A Generalization of Algebraic Surface Drawing\", ACM Transactions on Graphics 1(3), 1982","url":"https://doi.org/10.1145/357306.357310"},"summary":"Raymarched metaballs with a studio chrome environment.","description":"Three spheres blended with a polynomial smooth-min, raymarched in the fragment shader. Normals come from the gradient of the field. Metaballs are Jim Blinn's 1982 blobby surfaces; the chrome finish is the 1990s demo treatment of them: a fake studio HDR of a horizon gradient plus two specular lights sampled along the reflected ray, with a Fresnel mix, and no cubemap.","apis":["WebGL 1","GLSL ES 1.0","requestAnimationFrame","matchMedia"],"tags":["shader","raymarch"],"hasGlsl":true,"interaction":null,"url":"https://3d-retro.com/experiments/metaballs","example_url":"https://3d-retro.com/examples/metaballs.html","api_url":"https://3d-retro.com/api/v1/experiments/metaballs"},{"slug":"raytracer","number":"05","title":"Reflective spheres","era":"Whitted · 1980","section":"historical","provenance":"documented","reference":{"label":"T. Whitted, \"An Improved Illumination Model for Shaded Display\", Communications of the ACM 23(6), 1980","url":"https://doi.org/10.1145/358876.358882"},"summary":"A Whitted raytracer: three spheres, checkerboard, shadows, three bounces.","description":"Each pixel shoots a primary ray, intersects a plane and three spheres, then follows reflections for two extra bounces. Shadows are shadow rays toward a point light. The chrome ball is almost pure metal. The red and mint balls mix diffuse with a little reflection. The whole scene is one GLSL fragment shader.","apis":["WebGL 1","GLSL ES 1.0","requestAnimationFrame","matchMedia"],"tags":["shader","raytrace"],"hasGlsl":true,"interaction":null,"url":"https://3d-retro.com/experiments/raytracer","example_url":"https://3d-retro.com/examples/raytracer.html","api_url":"https://3d-retro.com/api/v1/experiments/raytracer"},{"slug":"ascii","number":"06","title":"ASCII torus","era":"donut.c · 2006","section":"historical","provenance":"documented","reference":{"label":"Andy Sloane, \"Have a donut\", a1k0n.net, 2006","url":"https://www.a1k0n.net/2006/09/15/obfuscated-c-donut.html"},"summary":"A rotating 3D torus rendered with a luminance character ramp.","description":"Andy Sloane's donut.c, drawn on a 2D canvas instead of stdout. Two nested angle loops sample a torus, project with a 1/z perspective divide, and keep a per-cell z-buffer. Lighting is a simple Lambert term mapped onto  .:-=+*#%@. Phosphor green on charcoal.","apis":["Canvas 2D","requestAnimationFrame","matchMedia"],"tags":["ascii","canvas"],"hasGlsl":false,"interaction":null,"url":"https://3d-retro.com/experiments/ascii","example_url":"https://3d-retro.com/examples/ascii.html","api_url":"https://3d-retro.com/api/v1/experiments/ascii"},{"slug":"globe","number":"07","title":"Wireframe globe","era":"Wireframe sphere · vector-display era","section":"historical","provenance":"interpretation","reference":null,"summary":"Latitude/longitude cage with a phosphor stroke. Drag to spin.","description":"A UV sphere as meridians and parallels, projected with a 1/z divide. Near edges are brighter than the far side, so the globe reads in depth without hidden-line removal. The equator and prime meridian are a touch hotter. It is the generic spinning wire globe of vector displays and early workstation demos, not a specific program. Drag to orbit. It keeps a slow auto-spin until you take over.","apis":["Canvas 2D","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["wireframe","3d"],"hasGlsl":false,"interaction":"Drag on the preview to spin the globe. Auto-rotation stops after the first drag.","url":"https://3d-retro.com/experiments/globe","example_url":"https://3d-retro.com/examples/globe.html","api_url":"https://3d-retro.com/api/v1/experiments/globe"},{"slug":"fluid","number":"08","title":"Fluid tank","era":"Stam · 1999","section":"historical","provenance":"documented","reference":{"label":"J. Stam, \"Stable Fluids\", SIGGRAPH 1999; the solver follows his GDC 2003 paper \"Real-Time Fluid Dynamics for Games\"","url":"https://doi.org/10.1145/311535.311548"},"summary":"A stable 2D Navier-Stokes dye tank. Stir it with the pointer.","description":"Jos Stam's stable fluids on a 48x48 grid: diffuse, project (Jacobi pressure), advect. Density is a phosphor dye; velocity is splatted along the pointer stroke. An ambient vortex keeps the tank moving when nobody is stirring. The solver is the textbook Game Developer Conference version.","apis":["Canvas 2D","ImageData","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["sim","fluid"],"hasGlsl":false,"interaction":"Move or drag on the preview to stir the dye. A slow vortex keeps it in motion on its own.","url":"https://3d-retro.com/experiments/fluid","example_url":"https://3d-retro.com/examples/fluid.html","api_url":"https://3d-retro.com/api/v1/experiments/fluid"},{"slug":"flow","number":"09","title":"Flow field","era":"Particle flow field · interpretation","section":"historical","provenance":"interpretation","reference":null,"summary":"A thousand particles following a curling field. Pointer makes a vortex.","description":"Each particle integrates a procedural vector field: sines for the ambient flow, plus a moving singularity that acts as a slow cyclone. The pointer adds a second vortex wherever it sits. Trails are a cheap canvas fade. Flow-field particles are a generic generative-art idiom with no single origin; nothing historical is claimed.","apis":["Canvas 2D","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["particles","field"],"hasGlsl":false,"interaction":"Move the pointer over the preview to twist the field into a vortex.","url":"https://3d-retro.com/experiments/flow","example_url":"https://3d-retro.com/examples/flow.html","api_url":"https://3d-retro.com/api/v1/experiments/flow"},{"slug":"fabric","number":"10","title":"Verlet fabric","era":"Jakobsen · 2001","section":"historical","provenance":"documented","reference":{"label":"T. Jakobsen, \"Advanced Character Physics\", Game Developers Conference 2001","url":"https://www.cs.cmu.edu/afs/cs/academic/class/15462-s13/www/lec_slides/Jakobsen.pdf"},"summary":"A hanging cloth. Drag a point to tug the weave.","description":"Thomas Jakobsen's Verlet cloth: a grid of points, distance constraints, gravity. Two corners are pinned. A slow sine is the wind. Drag any point and the rest of the mesh follows.","apis":["Canvas 2D","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["sim","cloth"],"hasGlsl":false,"interaction":"Drag a point on the cloth to tug it.","url":"https://3d-retro.com/experiments/fabric","example_url":"https://3d-retro.com/examples/fabric.html","api_url":"https://3d-retro.com/api/v1/experiments/fabric"},{"slug":"terrain","number":"11","title":"Wireframe terrain","era":"Vector CRT look · c. 1980","section":"historical","provenance":"interpretation","reference":null,"summary":"Scrolling vector hills. Pointer steers.","description":"A height field of summed sines, projected with a 1/z divide, stroked as a mesh that recedes into phosphor fog. The camera flies forward. Move the pointer to yaw. It evokes vector-monitor games such as Atari's Battlezone (1980) and the wireframe flight simulators of the early 1980s; those drew objects and horizons rather than a full mesh terrain, so this is a look, not a port.","apis":["Canvas 2D","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["wireframe","3d"],"hasGlsl":false,"interaction":"Move the pointer left or right to steer.","url":"https://3d-retro.com/experiments/terrain","example_url":"https://3d-retro.com/examples/terrain.html","api_url":"https://3d-retro.com/api/v1/experiments/terrain"},{"slug":"wolfenstein","number":"12","title":"Wolfenstein raycaster","era":"id Software · 1992","section":"historical","provenance":"documented","reference":{"label":"id Software, Wolfenstein 3D, 1992 (source released 1995); the per-column DDA raycast as described by Lode Vandevenne","url":"https://lodev.org/cgtutor/raycasting.html"},"summary":"A DDA raycaster. WASD to walk, pointer to look.","description":"Wolfenstein 3D's 2.5D engine: for each column, a ray steps a grid with DDA until it hits a wall, then a vertical strip is drawn at 1/distance. No polygons. Ceiling and floor are flats. A tiny map sits in the corner. It patrols the maze until you take over.","apis":["Canvas 2D","Keyboard Events","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["raycast","3d"],"hasGlsl":false,"interaction":"Click the preview first so it has keyboard focus. WASD or arrows to walk, A/D strafe, arrow keys turn. Move the pointer to glance; drag to turn. Walking follows the view.","url":"https://3d-retro.com/experiments/wolfenstein","example_url":"https://3d-retro.com/examples/wolfenstein.html","api_url":"https://3d-retro.com/api/v1/experiments/wolfenstein"},{"slug":"voxel","number":"13","title":"Voxel Space","era":"NovaLogic · 1992","section":"historical","provenance":"documented","reference":{"label":"NovaLogic, Comanche: Maximum Overkill, 1992; the Voxel Space column renderer as documented by Sebastian Macke","url":"https://github.com/s-macke/VoxelSpace"},"summary":"A heightmap ray-column renderer. Pointer steers.","description":"NovaLogic's Voxel Space: each screen column walks a height map, drawing a vertical strip whenever the terrain rises above what is already filled. Color comes from height and a cheap slope light. No polygons. The camera flies forward. Move the pointer to yaw.","apis":["Canvas 2D","ImageData","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["voxel","3d"],"hasGlsl":false,"interaction":"Move the pointer left or right to steer.","url":"https://3d-retro.com/experiments/voxel","example_url":"https://3d-retro.com/examples/voxel.html","api_url":"https://3d-retro.com/api/v1/experiments/voxel"},{"slug":"mode7","number":"14","title":"Mode 7 floor","era":"Super Famicom · 1990","section":"historical","provenance":"documented","reference":{"label":"Nintendo Super Famicom background Mode 7, 1990, as used for F-Zero's track","url":"https://en.wikipedia.org/wiki/Mode_7"},"summary":"Affine checkerboard ground, Space Harrier style. Pointer steers.","description":"For each scanline below the horizon, a distance is recovered from camera height and the line is a slice of a 2D texture. That is the SNES's Mode 7: no mesh, just a perspective divide on Y. The pylons are scaled billboards in the Space Harrier manner rather than anything Mode 7 did itself. Move the pointer to yaw.","apis":["Canvas 2D","ImageData","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["mode7","3d"],"hasGlsl":false,"interaction":"Move the pointer left or right to steer.","url":"https://3d-retro.com/experiments/mode7","example_url":"https://3d-retro.com/examples/mode7.html","api_url":"https://3d-retro.com/api/v1/experiments/mode7"},{"slug":"ps1","number":"15","title":"PS1 affine warp","era":"PlayStation · 1994","section":"historical","provenance":"documented","reference":{"label":"Sony PlayStation (1994): the GTE's integer vertex output and the GPU's affine, screen-space texture mapping","url":"https://en.wikipedia.org/wiki/PlayStation_technical_specifications"},"summary":"A checker cube and floor with screen-space UVs. Drag to orbit.","description":"The PlayStation's GPU interpolated texture coordinates in screen space, not 1/z, so large triangles swim, and its GTE handed over integer vertex positions, so edges wobble. This rasterizer does both on a 320-wide buffer. The floor is split into small cells because, like the original, it has no near-plane clipping: a triangle that reaches behind the eye is dropped whole. Drag to orbit. Auto-rotation stops after the first drag.","apis":["Canvas 2D","ImageData","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["raster","3d"],"hasGlsl":false,"interaction":"Drag on the preview to orbit. Auto-rotation stops after the first drag.","url":"https://3d-retro.com/experiments/ps1","example_url":"https://3d-retro.com/examples/ps1.html","api_url":"https://3d-retro.com/api/v1/experiments/ps1"},{"slug":"irobot","number":"16","title":"I, Robot polygons","era":"Atari · 1984","section":"historical","provenance":"documented","reference":{"label":"Atari, I, Robot (arcade, 1984), the first arcade game with filled 3D polygons","url":"https://en.wikipedia.org/wiki/I,_Robot_(video_game)"},"summary":"Filled cubes and pyramids, painter's algorithm. Drag to orbit.","description":"I, Robot was the first arcade game to fill polygons in real time. Faces are sorted back-to-front and painted. No z-buffer, no textures: a platform of blocks and pyramids in primary colours on black, seen from above the way the cabinet framed it. The scene is an homage to the game's look, not a level from it. Drag to orbit. It keeps a slow auto-spin until you take over.","apis":["Canvas 2D","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["polygon","3d"],"hasGlsl":false,"interaction":"Drag on the preview to orbit. Auto-rotation stops after the first drag.","url":"https://3d-retro.com/experiments/irobot","example_url":"https://3d-retro.com/examples/irobot.html","api_url":"https://3d-retro.com/api/v1/experiments/irobot"},{"slug":"teapot","number":"17","title":"Utah teapot","era":"Newell · 1975","section":"historical","provenance":"documented","reference":{"label":"M. Newell's teapot data set, University of Utah, 1975, as archived at cs.utah.edu/~natevm/newell_teaset and described in F. Crow, \"The Origins of the Teapot\", IEEE CG&A 7(1), 1987","url":"https://www.cs.utah.edu/~natevm/newell_teaset/newell_teaset.zip"},"summary":"The real Utah teapot: Newell's 32 Bézier patches, lit per pixel. Move the pointer to drag the lights.","description":"Martin Newell's 1975 teapot, built from his original 306 control points and 32 bicubic Bézier patches rather than approximated. The patches are evaluated in JavaScript at load, with analytic normals, in Newell's own proportions (the 4/3 vertical squash some renderers apply is not used). Lighting is per-pixel Phong with two point lights that sit in the scene as little orbs. Move the pointer: the key light follows, the fill stays opposite. Ceramic, lamp, and fill colours are on the tweak row.","apis":["WebGL 1","GLSL ES 1.0","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["webgl","3d"],"hasGlsl":true,"interaction":"Move the pointer to drag the two lights around the teapot.","url":"https://3d-retro.com/experiments/teapot","example_url":"https://3d-retro.com/examples/teapot.html","api_url":"https://3d-retro.com/api/v1/experiments/teapot"},{"slug":"tunnel","number":"18","title":"Dot/square tunnel","era":"Dot tunnel · demoscene, early 1990s","section":"historical","provenance":"interpretation","reference":null,"summary":"A twisting square tunnel of dots. Pointer shifts the vanishing point.","description":"Rings recede along Z. Each ring is a square outlined with dots, corners drawn as squares. A 1/z divide is the tunnel. Twist is a spin that grows with depth. Dot tunnels were a stock intro effect on the Amiga and PC around 1990 to 1993; this is the generic form, not a port of one. Move the pointer to drag the vanishing point.","apis":["Canvas 2D","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["demoscene","3d"],"hasGlsl":false,"interaction":"Move the pointer to shift the vanishing point.","url":"https://3d-retro.com/experiments/tunnel","example_url":"https://3d-retro.com/examples/tunnel.html","api_url":"https://3d-retro.com/api/v1/experiments/tunnel"},{"slug":"fire","number":"19","title":"Palette fire","era":"Palette fire · demoscene, early 1990s","section":"historical","provenance":"interpretation","reference":null,"summary":"Heat rises through a 256-color fire LUT. Pointer is a torch.","description":"The 1990s fire: a low-res buffer, each pixel is the average of the three below it minus a cooling term, then a palette from black through the tweak colour into yellow and white. The bottom row is random sparks. The algorithm is the widely shared one from early-1990s PC demos and tutorials; its first author is not documented, so no single original is claimed. Move the pointer to poke the fire.","apis":["Canvas 2D","ImageData","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["demoscene","palette"],"hasGlsl":false,"interaction":"Move the pointer over the preview to feed the fire.","url":"https://3d-retro.com/experiments/fire","example_url":"https://3d-retro.com/examples/fire.html","api_url":"https://3d-retro.com/api/v1/experiments/fire"},{"slug":"scope","number":"20","title":"XY oscilloscope","era":"Lissajous · 1857","section":"historical","provenance":"documented","reference":{"label":"J. A. Lissajous, \"Mémoire sur l'étude optique des mouvements vibratoires\", Annales de chimie et de physique, 1857; XY mode on an analogue oscilloscope","url":"https://en.wikipedia.org/wiki/Lissajous_curve"},"summary":"A Lissajous figure with phosphor persistence. Pointer changes the ratio.","description":"X is one sine, Y is another. That is the XY mode on a scope, and the picture is a Lissajous curve. Persistence is a cheap canvas fade. Move the pointer to detune the Y frequency. Ratio is the second harmonic.","apis":["Canvas 2D","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["vector","crt"],"hasGlsl":false,"interaction":"Move the pointer left or right to change the frequency ratio.","url":"https://3d-retro.com/experiments/scope","example_url":"https://3d-retro.com/examples/scope.html","api_url":"https://3d-retro.com/api/v1/experiments/scope"},{"slug":"boing","number":"21","title":"Boing ball","era":"Amiga · 1984","section":"historical","provenance":"documented","reference":{"label":"Boing Ball, Amiga demo by Dale Luck and R. J. Mical, shown at CES January 1984","url":"https://en.wikipedia.org/wiki/Amiga#Boing_Ball"},"summary":"Checkered sphere, bounce, shadow. Click to kick it.","description":"Commodore's 1984 show ball: a sphere with longitude/latitude checkers, Lambert-shaded, a flattened shadow on a perspective grid. It bounces with a little energy loss and rolls with its spin. Click to kick it.","apis":["Canvas 2D","ImageData","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["amiga","3d"],"hasGlsl":false,"interaction":"Click the preview to kick the ball.","url":"https://3d-retro.com/experiments/boing","example_url":"https://3d-retro.com/examples/boing.html","api_url":"https://3d-retro.com/api/v1/experiments/boing"},{"slug":"stargate","number":"22","title":"Slit-scan stargate","era":"Trumbull · 1968","section":"historical","provenance":"documented","reference":{"label":"Douglas Trumbull's slit-scan Star Gate sequence in 2001: A Space Odyssey, 1968","url":"https://en.wikipedia.org/wiki/Slit-scan_photography"},"summary":"A 2001 corridor from a moving slit. Pointer shifts the vanishing point.","description":"Douglas Trumbull's slit-scan: a one-dimensional strip of artwork is sampled while the camera dollies, so each pixel is a different moment. Here the slit is polar. Color streaks recede into a vanishing point. Move the pointer to shove the corridor.","apis":["Canvas 2D","ImageData","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["optical","3d"],"hasGlsl":false,"interaction":"Move the pointer to shift the vanishing point.","url":"https://3d-retro.com/experiments/stargate","example_url":"https://3d-retro.com/examples/stargate.html","api_url":"https://3d-retro.com/api/v1/experiments/stargate"},{"slug":"ruttetra","number":"23","title":"Rutt-Etra scan","era":"Rutt/Etra · 1973","section":"historical","provenance":"documented","reference":{"label":"Rutt/Etra Video Synthesizer, Steve Rutt and Bill Etra, 1973","url":"https://en.wikipedia.org/wiki/Rutt/Etra_Video_Synthesizer"},"summary":"A video raster displaced by luminance. Drag to orbit.","description":"The Rutt-Etra scan processor took a video signal and bent each scanline in Z by brightness. This one synthesizes a cheap 'video' of blobs and rings, then draws it as a wire mesh. Drag to orbit. It keeps a slow auto-spin until you take over.","apis":["Canvas 2D","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["video","3d"],"hasGlsl":false,"interaction":"Drag on the preview to orbit. Auto-rotation stops after the first drag.","url":"https://3d-retro.com/experiments/ruttetra","example_url":"https://3d-retro.com/examples/ruttetra.html","api_url":"https://3d-retro.com/api/v1/experiments/ruttetra"},{"slug":"glenz","number":"24","title":"Glenz vectors","era":"Glenz vectors · Amiga demoscene, c. 1989","section":"historical","provenance":"interpretation","reference":null,"summary":"Translucent filled polygons, additive. Drag to orbit.","description":"Glenz vectors were the Amiga demo trick of drawing a solid with see-through faces so the back sides pile up as light. The original effect faked transparency with a purpose-built palette and bit-plane tricks on a 16- or 32-colour screen. This one does not: it is an icosahedron, painter-sorted and drawn with ordinary canvas alpha in additive mode, which gives the glow without the period technique. Magenta against cyan unless you change it. Drag to orbit.","apis":["Canvas 2D","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["demoscene","3d"],"hasGlsl":false,"interaction":"Drag on the preview to orbit. Auto-rotation stops after the first drag.","url":"https://3d-retro.com/experiments/glenz","example_url":"https://3d-retro.com/examples/glenz.html","api_url":"https://3d-retro.com/api/v1/experiments/glenz"},{"slug":"hopalong","number":"25","title":"Hopalong attractor","era":"Martin · 1986","section":"historical","provenance":"documented","reference":{"label":"Barry Martin's hopalong map, as presented by A. K. Dewdney in Scientific American, September 1986","url":"https://en.wikipedia.org/wiki/Barry_Martin_(mathematician)"},"summary":"A one-line iterator that fills a CRT. Pointer nudges a.","description":"Barry Martin's hopalong: x' = y − sign(x)·√|bx − c|, y' = a − x. Plot the orbit and a shape appears. Move the pointer to detune a. Color is additive phosphor.","apis":["Canvas 2D","ImageData","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["attractor","plotter"],"hasGlsl":false,"interaction":"Move the pointer left or right to change the constant a.","url":"https://3d-retro.com/experiments/hopalong","example_url":"https://3d-retro.com/examples/hopalong.html","api_url":"https://3d-retro.com/api/v1/experiments/hopalong"},{"slug":"penrose","number":"26","title":"Penrose tiling","era":"Penrose · 1974","section":"historical","provenance":"documented","reference":{"label":"R. Penrose, \"The role of aesthetics in pure and applied mathematical research\", Bulletin of the IMA 10, 1974; Robinson-triangle subdivision","url":"https://en.wikipedia.org/wiki/Penrose_tiling"},"summary":"Robinson triangles, aperiodic, drawn once.","description":"A pentagon of acute golden triangles, subdivided by Robinson's rule. Two rhombs, no period. Fat and thin take the two tweak colours. Depth rebuilds the mesh. Nothing moves and there is nothing to pan to, so the tiling is drawn once and again on resize.","apis":["Canvas 2D"],"tags":["tiling","geometry"],"hasGlsl":false,"interaction":null,"url":"https://3d-retro.com/experiments/penrose","example_url":"https://3d-retro.com/examples/penrose.html","api_url":"https://3d-retro.com/api/v1/experiments/penrose"},{"slug":"elite","number":"27","title":"Elite planet","era":"Braben and Bell · 1984","section":"historical","provenance":"interpretation","reference":{"label":"Elite, David Braben and Ian Bell, Acornsoft 1984","url":"https://en.wikipedia.org/wiki/Elite_(video_game)"},"summary":"A dotted sphere and a starfield. Drag to spin.","description":"Elite's worlds were wireframe circles with a line or a crater on a BBC Micro; the dotted sphere with a lit terminator and a ring here is how its planets are remembered rather than how they were drawn, so treat it as an interpretation. No textures. Drag to spin. It keeps a slow auto-rotate until you take over.","apis":["Canvas 2D","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["wireframe","3d"],"hasGlsl":false,"interaction":"Drag on the preview to spin the planet. Auto-rotation stops after the first drag.","url":"https://3d-retro.com/experiments/elite","example_url":"https://3d-retro.com/examples/elite.html","api_url":"https://3d-retro.com/api/v1/experiments/elite"},{"slug":"vortex","number":"28","title":"Spaghetti vortex","era":"Illustration · 2026","section":"modern","provenance":"interpretation","reference":null,"summary":"A concentrating 3D vortex. Trails spiral in as the core slims. Illustration, not a solver.","description":"Parametric helices scaled by the 2026 OpenAI paper's leading laws: radius follows tau^(1/2), height tau^(1/2−h), with illustrative h = 0.005 and tau = 1−t/T*. Both shrink; radius shrinks faster. Drag to orbit, scrub toward T*, or follow the core with a labeled uniform zoom. Color shows normalized radius. Oscillatory corrections are omitted. Illustration of the proposed blowup construction; not a numerical reproduction of the proof.","apis":["WebGL 1","GLSL ES 1.0","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["webgl","3d","particles"],"hasGlsl":true,"interaction":"Drag to orbit; auto-rotation stops after the first drag. Play, pause, scrub the approach, or follow the core.","url":"https://3d-retro.com/experiments/vortex","example_url":"https://3d-retro.com/examples/vortex.html","api_url":"https://3d-retro.com/api/v1/experiments/vortex"},{"slug":"dualtank","number":"29","title":"Dual tank","era":"Stam 1999 solver · 2026 illustration","section":"modern","provenance":"documented","reference":{"label":"J. Stam, \"Stable Fluids\", SIGGRAPH 1999, for the solver; the strained display on the right is a 2026 illustration","url":"https://doi.org/10.1145/311535.311548"},"summary":"Same 48×48 Stam twice. Left is bounded. Right is a lying legend.","description":"Split screen, two copies of the GDC Stam solver. Left is the usual dye tank, labeled bounded. Right runs the same step, then a display-only strain: dye is sampled through an inward spiral and an axial stretch, and the false-color speed scale goes as 1/(T*−t). Orange is the boosted speed, teal is slow. The code on the right is still stable. The legend is not. Stir either side. T* is the horizon slider.","apis":["Canvas 2D","ImageData","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["sim","fluid"],"hasGlsl":false,"interaction":"Move or drag on either half to stir that tank. Right-hand color scale grows as t approaches T*.","url":"https://3d-retro.com/experiments/dualtank","example_url":"https://3d-retro.com/examples/dualtank.html","api_url":"https://3d-retro.com/api/v1/experiments/dualtank"},{"slug":"spiralstretch","number":"30","title":"Spiral stretch","era":"Illustration · 2026","section":"modern","provenance":"interpretation","reference":null,"summary":"A hopalong cousin: radius shrinks, z grows. Pointer detunes the shrink.","description":"No fluid solver. Each iterate is r ← k r, θ ← θ + ω, z ← z + c/r. Plot (r cos θ, r sin θ + z) and you get the cartoon of inward spiral plus axial stretch — the 2026 Navier–Stokes construction as a CRT orbit. Teal is early, orange is stretched. Pointer nudges k. When a walker's radius collapses it reseeds on the ring.","apis":["Canvas 2D","ImageData","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["attractor","crt"],"hasGlsl":false,"interaction":"Move the pointer left or right to change how fast the radius shrinks.","url":"https://3d-retro.com/experiments/spiralstretch","example_url":"https://3d-retro.com/examples/spiralstretch.html","api_url":"https://3d-retro.com/api/v1/experiments/spiralstretch"},{"slug":"burgers","number":"31","title":"Burgers shock","era":"Hopf · 1950 · 2026 illustration","section":"modern","provenance":"documented","reference":{"label":"E. Hopf, \"The partial differential equation u_t + uu_x = μu_xx\", Communications on Pure and Applied Mathematics 3, 1950","url":"https://doi.org/10.1002/cpa.3160030302"},"summary":"Inviscid Burgers. Characteristics cross at a predicted T*.","description":"u_t + u u_x = 0 with u₀ = −amp sin(x). The most negative slope is −amp, so the classical solution ends at T* = 1/amp. Each particle keeps its speed; the x–t plot is those lines, and they cross at T*. ‖∂x u‖∞ = 1/(T*−t) until it leaves the top of the chart. After T* the parametric wave is multi-valued; the vertical mark is the entropy shock. This one actually blows up. Pointer sets the phase.","apis":["Canvas 2D","Pointer Events","requestAnimationFrame","matchMedia"],"tags":["pde","shock"],"hasGlsl":false,"interaction":"Move the pointer left or right to shift the phase of the sine.","url":"https://3d-retro.com/experiments/burgers","example_url":"https://3d-retro.com/examples/burgers.html","api_url":"https://3d-retro.com/api/v1/experiments/burgers"}]}