Canvas UI

Canvas UI supplies an open source collection of creative html-in-canvas and WebGL components. It addresses the need for developers to add visual effects such as particle reveals, liquid glass, shatter, and VHS without writing low-level canvas or WebGL code themselves.

The library contains 24 components that run live HTML content inside canvas environments. Each component can be added through a single command using the shadcn-style CLI, which copies the full source code directly into the developer's project. Once installed the code resides in the local repository, allowing full customization of props, styling, or complete modification. Every demo shown on the site executes the actual component in real time.

Canvas UI is framework agnostic. It delivers each effect in four variants: React, Vue, Svelte, and dependency-free vanilla TypeScript. The components share the same underlying engine and props across these flavors so they integrate natively with the chosen stack. Installation uses the command npx shadcn@latest add followed by a registry URL such as https://canvasui.dev/r/particle-reveal-react.json.

The project is 100 percent free and open source with no paid tiers. Source code is available on GitHub and the components can be browsed at canvasui.dev/components. It is distributed as a component library for developers building with modern web frameworks or vanilla JavaScript.