Build with BroMetal
The WebGPU engine
for AI coding agents.
55 live examples. Every pixel comes from a TypeScript shader, compiled to WGSL before the browser loads. Open one, move it, then read the source.
Explore the GPU
Choose an example
LIVEArcade WarpNEWA saturated star tunnel accelerates toward an impossible arcade horizon.
LIVEBioluminescent ReefNEWLiving cyan cells pulse and communicate across a midnight reef.
LIVEBlendOne shader, three blend modes — opaque, alpha transparency, and additive glow, switched with a program option.
LIVEBrocraftA blocky voxel world you can fly through — the terrain, every block material, and all the culling are computed in the vertex shader.
LIVECameraInteractive camera: position and rotation sliders driving a cached view-projection matrix.
LIVECausticsA prebuilt Caustics study using voronoi2, ready to import from brometal/shaders.
LIVECheckerboardA prebuilt Checkerboard study using rotate2, ready to import from brometal/shaders.
LIVEChromatic AberrationA prebuilt Chromatic Aberration study using texture(), ready to import from brometal/shaders.
LIVECosine PaletteA prebuilt Cosine Palette study using cosinePalette, ready to import from brometal/shaders.
LIVECRTA prebuilt CRT study using texture(), ready to import from brometal/shaders.
LIVECrystal CathedralNEWPrismatic vaults repeat into an impossible mirrored sanctuary.
LIVECustom ShaderProcedural plasma written in plain TypeScript — helper functions, let, and for loops compiled to WGSL.
LIVEData WaterfallNEWDense luminous symbols pour down a curved digital surface.
LIVEDay OceanEight Gerstner waves shape tropical water with analytic normals, refracted caustics, depth-aware colour, and steepness-driven foam.
LIVEDomain WarpA prebuilt Domain Warp study using warp2 · cosinePalette, ready to import from brometal/shaders.
LIVEEdge DetectA prebuilt Edge Detect study using luminance, ready to import from brometal/shaders.
LIVEEvent HorizonNEWA lensing black-hole silhouette wrapped in a white-hot, Doppler-shifted accretion ring.
LIVEFBM CloudsA prebuilt FBM Clouds study using fbm2, ready to import from brometal/shaders.
LIVEFireA prebuilt Fire study using fbm2, ready to import from brometal/shaders.
LIVEGeometryEvery built-in geometry — cube, sphere, torus knot, and friends — with a live selector.
LIVEGlitchA prebuilt Glitch study using hash11, ready to import from brometal/shaders.
LIVEHalftoneA prebuilt Halftone study using luminance · rotate2 · fillAA, ready to import from brometal/shaders.
LIVEJulia JewelNEWA polished complex-plane jewel refracts a continuously evolving boundary.
LIVEJulia SetA prebuilt Julia Set study using cosinePalette, ready to import from brometal/shaders.
LIVEKaleidoscopeA prebuilt Kaleidoscope study using fbm2 · cosinePalette, ready to import from brometal/shaders.
LIVELegend of BroA top-down overworld you can walk around — a tilemap and every animated sprite drawn from one atlas in two instanced draw calls.
LIVELightBlinn-Phong lighting on solid-colored faces with a movable point light.
LIVELightingA prebuilt Lighting study using lambert · blinnPhongSpec · fresnel · hemisphereLight, ready to import from brometal/shaders.
LIVELightningA prebuilt Lightning study using fbm2 · hash11, ready to import from brometal/shaders.
LIVELightning OracleNEWForking electric paths repeatedly discover a radiant central sigil.
LIVEMetaballsA prebuilt Metaballs study using cosinePalette, ready to import from brometal/shaders.
LIVEModelA textured spaceship loaded from a .glb file with loadGlb — CC0 model by Quaternius.
LIVENanite-Style TeapotsA 400 × 400 Utah teapot field represents 1.01 billion source triangles with compute culling, GPU-built visibility queues, and indirect LOD draws.
LIVENight OceanA moonlit ocean — Gerstner waves in the vertex shader, fbm micro-ripples, fresnel, and a specular glint per pixel.
LIVEQuantum Halo120,000 independently lit cuboids form a rippling kinetic sculpture in one draw call.
LIVERaymarchingA prebuilt Raymarching study using sdSphere3 · sdBox3 · sdTorus3 · smoothUnion · lambert · fresnel, ready to import from brometal/shaders.
LIVERingsA prebuilt Rings study using fbm2 · cosinePalette, ready to import from brometal/shaders.
LIVERipplesElastic ripples rolling across a surface — easing functions driving per-vertex animation on the GPU.
LIVERotating CubeHello world: one spinning cube, a TypeScript shader, and the WebGPU runtime.
LIVESDF ShapesA prebuilt SDF Shapes study using sdCircle · sdBox2 · smoothUnion · fillAA, ready to import from brometal/shaders.
LIVESepia + VignetteA prebuilt Sepia + Vignette study using luminance, ready to import from brometal/shaders.
LIVEShader FunctionsA visual reference example for every function in brometal/shader-functions — noise, easing, color, lighting, SDFs.
LIVEShadowShadow mapping in two passes — geometry rendered from the light into a depth-tested render target, then sampled back with 9-tap PCF.
LIVESolar FlareNEWMagnetic ribbons peel away from a turbulent star in incandescent loops.
LIVEStained LightNEWJewel-toned panes throw animated pools of colour through smoky air.
LIVEStar BroA playable flight experience — fly the Spitfire through an instanced asteroid field with an additive engine trail and a follow camera.
LIVEStarfieldA prebuilt Starfield study using hash22 · hash21, ready to import from brometal/shaders.
LIVESynthwave HorizonNEWA laser sun sinks behind a racing perspective grid and chrome mountains.
LIVETerrainA 65k-vertex plane sculpted into rolling terrain by fbm noise running in the vertex shader.
LIVETextureA lit, textured cube — move the light and pick from nine CC0 textures.
LIVEToon ShadingA neon torus knot and orbiting moons rendered with stepped light, graphic highlights, silhouette ink, and shadow hatching.
LIVETunnelA prebuilt Tunnel study using rotate2, ready to import from brometal/shaders.
LIVEValue NoiseA prebuilt Value Noise study using vnoise2, ready to import from brometal/shaders.
LIVEVoronoiA prebuilt Voronoi study using voronoi2 · hash22, ready to import from brometal/shaders.
LIVEWorley EdgesA prebuilt Worley Edges study using worleyEdge2, ready to import from brometal/shaders.