Canvas UI
Canvas UI is An open source component library of creative html-in-canvas effects for React, Solid, Preact, Vue, Svelte, and vanilla JS. Every effect ships as WebGL and WebGPU (via vgpu) builds, running over live HTML.. It is ranked #452 on the Dev Radar, in Web frameworks, first seen 19 days ago and shared in 6 posts (290.4k views).
Canvas UI: Creative Canvas, WebGL and WebGPU Component Library Creative components, in a new dimension. An open source library of tasteful html-in-canvas components, in WebGL or WebGPU. Framework agnostic. Get started Browse components Components 35 And counting Open source 100% Free forever Install One command npx shadcn@latest add @canvas-ui/particle-reveal-react The library Every component, alive on canvas. Browse all Community Featured on YouTube See Canvas UI in action in these awesome videos. Hyperplexed tests Canvas UI in an interactive music player packed with HTML-in-Canvas effects. Better Stack showcases Canvas UI's GPU-powered…
What people said about Canvas UI on X
Okay, Fable 5.1 is crazy good at creating three.js sites. It’s faster, understands complex design instructions better, and recreates references with surgical precision. The English is also much easier to read. With this much power, it’s hard to settle for static sites, especially when so many AI-made sites look…
— @MengTo, 17 days ago · 1.9k likes · see the post
Insane what you can create with three.js nowadays. I made a game-quality 3D experience in the browser with water ripples, smoke effects, a 3D paper menu, underwater UI, and a peeling footer. The whole thing is pure code and only 183 KB. Seriously, no loading screen needed. I combined http://canvasui.dev and…
— @MengTo, 19 days ago · 702 likes · see the post
I open-sourced the three.js site I built with Fable 5.1. I pushed the Kyoto theme further with tatami spaces, sliding doors, a 3D plastic menu, and a retro footer animation. It's surprising how much you can reshape when the whole experience is procedural code. Live site: https://mengto.github.io/sublevel-studio…
— @MengTo, 16 days ago · 382 likes · see the post
Alternatives to Canvas UI
- React Bits — just hit 47K stars.
- Cube — Cube is a zero-dependency JavaScript animation library with four fixed motions, adapters for React, Vue, Solid and…
- better-ui — Polishes and improves the UI in your project. Covers concentric border radius, optical alignment, surface depth,…
- oj — The benchmark in the blog post is somewhat misleading. It notes the Vite cold start time includes the significant…
- pdfcn — Beautiful pdf components, built on Takumi and Forme. 100% Free, Zero config, one command setup. - shadcn-labs/pdfcn
- Laravel — Laravel is a framework for building modern web apps and AI agents. Expressive syntax, built-in tools, and everything…
Canvas UI in numbers
- Rank on the Dev Radar: #452 of 1348
- Shared in 6 posts by 2 accounts: @MengTo, @davidhaz
- 290.4k views on those posts
- First seen 19 days ago, last shared 6 days ago
- Pricing seen by Jev: open source
- Market: Web frameworks
FAQ
What is Canvas UI?
An open source component library of creative html-in-canvas effects for React, Solid, Preact, Vue, Svelte, and vanilla JS. Every effect ships as WebGL and WebGPU (via vgpu) builds, running over live HTML. It was first shared on X 19 days ago and is ranked #452 on the Dev Radar.
Is Canvas UI free?
It is open source.
Who shared Canvas UI?
2 accounts on X, including @MengTo, @davidhaz, in 6 posts totalling 290.4k views.
Every post is read and classified by Jev (TypeSafe): what it is, which market it belongs to, and whether the link is a real tool. 12.2k posts from 4.7k X accounts over the last 21 days, 1.3k tools, 12 markets. Collected every 5 minutes, fully re-ranked every hour — last update 2026-09-19 17:26 UTC. Full method.