Zain Dana HarperRetro Engine

Bring the engine back as a live retro renderer.

Retro Engine is an embedded browser studio for images, drawing, GLSL, and audio traces. It applies pixelation, hardware palettes, ordered dithering, early-3D shading, CRT processing, and stackable effects, then exports images, patches, MIDI, relief or disc data, and Loom handoffs.

source → pixelate · palette · dither · CRT · nothing leaves your browser

The Retro Engine

Preset
Fragment shader
Knobs iKnobA / B / C in your code
A 0.50
B 0.50
C 0.50

Write your own GLSL and read iAudio (bass, mid, treble, level), iKnobA/B/C, iMouse and iTime. Save it to your shelf or copy a link that carries it. Kept in this browser; nothing uploads.

Shader stack1 layer
Stack another shader, blended
Picture palette, grid, tube
Palette
In the picture the colours this frame is actually made of
Pixel size 240
Dither
Dither strength 0.80
Gamma 1.0
Scanlines 0.35
Phosphor mask
Mask strength 0.30
Bloom 0.18
Halation 0.20
Curvature 0.12
Colour fringe 0.10
Vignette 0.25
Effects rack0 on
Amount sets every active effect 0.50
Glitch seed
 
Sound off

Every edit plays a note, the shader sings its own math, and sound feeds back into the picture. Nothing is recorded or uploaded.

Sound drives 0.60
Reactivity
Motion patch anything into anything
Feedback the last frame folded back in
Decay 55
Zoom 1.5
Rotate 0.4
no device
Save, send, make it physical
Make it physical
Performance score every edit you make is a note

A patch is the whole setup: shader, stack, palette, every effect and its amount, and the sound routing. Save it, or copy a link that carries all of it. Send to Studio hands the render to the pen surface as a plot map, then on to SVG or G-code. Everything stays in your browser.

Keys F full screen · R randomize · S save PNG · space animate · [ ] amount. Double-click the picture for full screen. Drag on the picture to move the light in most shaders.

The renderer is ordinary readable JavaScript: system/retro-engine.js, system/retro-palettes.js, system/shader-runner.js. Palettes and the OKLab math match the coherence-membrane retro.py pipeline. The dither picks between the two nearest palette colours, and the tube stage adds a shaped beam, a phosphor mask, halation, and a bezel. Its scanline rows keep the retro.py row mean, so a browser render and an offline render agree in tone.

Related retro products.

Each route maintains its own definition and evidence record. Follow its product page for current scope and proof.