HTML-in-Canvas demos
Live DOM drawn into canvas and WebGPU scenes.
Demos
Gamer Room
A three.js gaming room whose screens show live, interactive web pages.
Webpage Bulldozer
A WebGPU bulldozer pushes a real webpage's words, images and widgets into piles.
HTML Ninja
Slice flying buttons, banners and toggles with your cursor. Whatever you do, don't slice the molotov.
Effects
Hello, Canvas
The smallest example: a live HTML card waving in a WebGL shader. One file, no build, easy to read.
Teleport
Flip a switch to beam a live settings form out in glowing motes, and back in.
Post-Processing
Bloom, motion blur, screen fringe and vignette over a live, animated page.
Page Transitions
Pick any of 56 game transitions and turn one live page into another.
Slider on Fire
A real range slider drawn into WebGL. Drag it to set the page alight.
Dust to Dust
A live form turns to stone, crumbles and blows away on the wind. Switch it back to rebuild it.
Frosty Checkboxes
Real checkboxes that frost over when you tick them, with sliders to tune the ice.
High Voltage
Turn up the voltage and real form controls crackle with arcs of electricity.
opera://flags/#canvas-draw-element (or chrome://flags/#canvas-draw-element) → Enabled, then relaunch.
The bulldozer also needs WebGPU; HTML Ninja and the effects need WebGL2.