Canvas UI: Creative WebGL Components Rendered Over Live HTML on Canvas
Content is AI-assisted and may contain inaccuracies.
Canvas UI is an open-source library of creative, framework-agnostic components drawn on canvas. It renders real HTML inside a canvas element and applies WebGL effects—fluid simulations, shaders, and 3D scenes—on top while keeping the underlying content fully interactive.
Most components use the experimental html-in-canvas API, which lets a canvas element lay out and paint live DOM content as a texture that shaders can sample and distort. No screenshots, iframes, or DOM-to-image workarounds are needed. Some effects bypass the API entirely and rely on pure WebGL shaders that run everywhere today. The library works across React, Vue, Svelte, and vanilla JavaScript.