Canvas UI
An open source library of creative, framework-agnostic components drawn on canvas. Fluid simulations, shader effects, and 3D scenes that run over your live, fully interactive interface.
canvasui.dev · Docs · Components · Playground · Installation
Most components use the experimental HTML-in-canvas API to read and redraw your live DOM. Text stays selectable, links stay clickable, and the page becomes a texture that fire, fluid, and glass distort in real time.
View Canvas UI on GitHub
Curated by Navid Moazzez·Updated Oct 4, 2026·1 min read·Navid.me is reader-supported. When you buy through links on this site, I may earn an affiliate commission. Learn more.
An open source library of creative, framework-agnostic components drawn on canvas. Fluid simulations, shader effects, and 3D scenes that run over your live, fully interactive interface.
canvasui.dev · Docs · Components · Playground · Installation
Most components use the experimental HTML-in-canvas API to read and redraw your live DOM. Text stays selectable, links stay clickable, and the page becomes a texture that fire, fluid, and glass distort in real time.
Canvas UI at a glance
| Stars | 4.7k |
|---|---|
| Forks | 237 |
| Language | TypeScript |
| License | Other |
| Last update | 2026-10-03 |
| Contributors | 18 |
How to install Canvas UI
bash npx shadcn@latest add @canvas-ui/liquid-react