Skia · Runtime Shader

A GPU shader, compiled live in your browser

Not a video. Not a GIF. Every pixel below is computed 60×/second by a fragment shader Skia compiled at runtime — move your cursor through it.

SkSL runtime shader
fps ·
move / drag the cursor
Loading Skia (WebAssembly, ~6.8 MB)…

Why this needs Skia

The whole image is a single piece of GPU code — a fragment shader written in SkSL, Skia's shading language. It is handed to Skia as a plain string and compiled to native GPU instructions at runtime, then run once per pixel, every frame.

The HTML5 Canvas 2D API has no equivalent — it can draw shapes, gradients and images, but it cannot run your own per-pixel code. Skia ships the shader compiler itself: CanvasKit.RuntimeEffect.Make(sksl). The flowing field here is domain-warped fractal noise; your cursor feeds a live uniform into it.

Skia CanvasKit · WebAssembly · self-hosted on Cloudflare Pages ← Back to the demo site