@canvas-ui
Creative html-in-canvas components. React, Vue, Svelte, TS.
Install this registry
npx shadcn@latest add https://canvasui.dev/r/registry.json pnpm dlx shadcn@latest add https://canvasui.dev/r/registry.json bunx shadcn@latest add https://canvasui.dev/r/registry.json curl -s https://canvasui.dev/r/registry.json Components
250 totalRenders any GLB/glTF model, SVG, or image in a floating studio scene as ASCII characters chosen by shape, so glyphs trace the object's edges. Built on three.js.
npx shadcn@latest add https://canvasui.dev/r/ascii-object-react.json Renders any GLB/glTF model, SVG, or image in a floating studio scene as ASCII characters chosen by shape, so glyphs trace the object's edges. Built on three.js.
npx shadcn@latest add https://canvasui.dev/r/ascii-object-vue.json Renders any GLB/glTF model, SVG, or image in a floating studio scene as ASCII characters chosen by shape, so glyphs trace the object's edges. Built on three.js.
npx shadcn@latest add https://canvasui.dev/r/ascii-object-svelte.json Renders any GLB/glTF model, SVG, or image in a floating studio scene as ASCII characters chosen by shape, so glyphs trace the object's edges. Built on three.js.
npx shadcn@latest add https://canvasui.dev/r/ascii-object-solid.json Renders any GLB/glTF model, SVG, or image in a floating studio scene as ASCII characters chosen by shape, so glyphs trace the object's edges. Built on three.js.
npx shadcn@latest add https://canvasui.dev/r/ascii-object-preact.json Renders any GLB/glTF model, SVG, or image in a floating studio scene as ASCII characters chosen by shape, so glyphs trace the object's edges. Built on three.js.
npx shadcn@latest add https://canvasui.dev/r/ascii-object-vanilla.json Renders any GLB/glTF model, SVG, or image in a floating studio scene as ASCII characters chosen by shape, so glyphs trace the object's edges. Built on three.js…
npx shadcn@latest add https://canvasui.dev/r/ascii-object-react-webgpu.json Renders any GLB/glTF model, SVG, or image in a floating studio scene as ASCII characters chosen by shape, so glyphs trace the object's edges. Built on three.js…
npx shadcn@latest add https://canvasui.dev/r/ascii-object-vue-webgpu.json Renders any GLB/glTF model, SVG, or image in a floating studio scene as ASCII characters chosen by shape, so glyphs trace the object's edges. Built on three.js…
npx shadcn@latest add https://canvasui.dev/r/ascii-object-svelte-webgpu.json Renders any GLB/glTF model, SVG, or image in a floating studio scene as ASCII characters chosen by shape, so glyphs trace the object's edges. Built on three.js…
npx shadcn@latest add https://canvasui.dev/r/ascii-object-solid-webgpu.json Renders any GLB/glTF model, SVG, or image in a floating studio scene as ASCII characters chosen by shape, so glyphs trace the object's edges. Built on three.js…
npx shadcn@latest add https://canvasui.dev/r/ascii-object-preact-webgpu.json Renders any GLB/glTF model, SVG, or image in a floating studio scene as ASCII characters chosen by shape, so glyphs trace the object's edges. Built on three.js…
npx shadcn@latest add https://canvasui.dev/r/ascii-object-vanilla-webgpu.json Swaps two panels of live HTML with a band of glowing ascii characters that sweeps across the exact text lines, tearing rows and trailing phosphor as it passes.…
npx shadcn@latest add https://canvasui.dev/r/ascii-sweep-react.json Swaps two panels of live HTML with a band of glowing ascii characters that sweeps across the exact text lines, tearing rows and trailing phosphor as it passes.…
npx shadcn@latest add https://canvasui.dev/r/ascii-sweep-vue.json Swaps two panels of live HTML with a band of glowing ascii characters that sweeps across the exact text lines, tearing rows and trailing phosphor as it passes.…
npx shadcn@latest add https://canvasui.dev/r/ascii-sweep-svelte.json Swaps two panels of live HTML with a band of glowing ascii characters that sweeps across the exact text lines, tearing rows and trailing phosphor as it passes.…
npx shadcn@latest add https://canvasui.dev/r/ascii-sweep-solid.json Swaps two panels of live HTML with a band of glowing ascii characters that sweeps across the exact text lines, tearing rows and trailing phosphor as it passes.…
npx shadcn@latest add https://canvasui.dev/r/ascii-sweep-preact.json Swaps two panels of live HTML with a band of glowing ascii characters that sweeps across the exact text lines, tearing rows and trailing phosphor as it passes.…
npx shadcn@latest add https://canvasui.dev/r/ascii-sweep-vanilla.json Swaps two panels of live HTML with a band of glowing ascii characters that sweeps across the exact text lines, tearing rows and trailing phosphor as it passes.…
npx shadcn@latest add https://canvasui.dev/r/ascii-sweep-react-webgpu.json Swaps two panels of live HTML with a band of glowing ascii characters that sweeps across the exact text lines, tearing rows and trailing phosphor as it passes.…
npx shadcn@latest add https://canvasui.dev/r/ascii-sweep-vue-webgpu.json Swaps two panels of live HTML with a band of glowing ascii characters that sweeps across the exact text lines, tearing rows and trailing phosphor as it passes.…
npx shadcn@latest add https://canvasui.dev/r/ascii-sweep-svelte-webgpu.json Swaps two panels of live HTML with a band of glowing ascii characters that sweeps across the exact text lines, tearing rows and trailing phosphor as it passes.…
npx shadcn@latest add https://canvasui.dev/r/ascii-sweep-solid-webgpu.json Swaps two panels of live HTML with a band of glowing ascii characters that sweeps across the exact text lines, tearing rows and trailing phosphor as it passes.…
npx shadcn@latest add https://canvasui.dev/r/ascii-sweep-preact-webgpu.json Swaps two panels of live HTML with a band of glowing ascii characters that sweeps across the exact text lines, tearing rows and trailing phosphor as it passes.…
npx shadcn@latest add https://canvasui.dev/r/ascii-sweep-vanilla-webgpu.json Redraws your page as live ascii characters in a soft radius around the cursor, with real glyph, shade block, and binary ramps. The HTML stays interactive in Ch…
npx shadcn@latest add https://canvasui.dev/r/asciify-react.json Redraws your page as live ascii characters in a soft radius around the cursor, with real glyph, shade block, and binary ramps. The HTML stays interactive in Ch…
npx shadcn@latest add https://canvasui.dev/r/asciify-vue.json Redraws your page as live ascii characters in a soft radius around the cursor, with real glyph, shade block, and binary ramps. The HTML stays interactive in Ch…
npx shadcn@latest add https://canvasui.dev/r/asciify-svelte.json Redraws your page as live ascii characters in a soft radius around the cursor, with real glyph, shade block, and binary ramps. The HTML stays interactive in Ch…
npx shadcn@latest add https://canvasui.dev/r/asciify-solid.json Redraws your page as live ascii characters in a soft radius around the cursor, with real glyph, shade block, and binary ramps. The HTML stays interactive in Ch…
npx shadcn@latest add https://canvasui.dev/r/asciify-preact.json Redraws your page as live ascii characters in a soft radius around the cursor, with real glyph, shade block, and binary ramps. The HTML stays interactive in Ch…
npx shadcn@latest add https://canvasui.dev/r/asciify-vanilla.json Redraws your page as live ascii characters in a soft radius around the cursor, with real glyph, shade block, and binary ramps. The HTML stays interactive in Ch…
npx shadcn@latest add https://canvasui.dev/r/asciify-react-webgpu.json Redraws your page as live ascii characters in a soft radius around the cursor, with real glyph, shade block, and binary ramps. The HTML stays interactive in Ch…
npx shadcn@latest add https://canvasui.dev/r/asciify-vue-webgpu.json Redraws your page as live ascii characters in a soft radius around the cursor, with real glyph, shade block, and binary ramps. The HTML stays interactive in Ch…
npx shadcn@latest add https://canvasui.dev/r/asciify-svelte-webgpu.json Redraws your page as live ascii characters in a soft radius around the cursor, with real glyph, shade block, and binary ramps. The HTML stays interactive in Ch…
npx shadcn@latest add https://canvasui.dev/r/asciify-solid-webgpu.json Redraws your page as live ascii characters in a soft radius around the cursor, with real glyph, shade block, and binary ramps. The HTML stays interactive in Ch…
npx shadcn@latest add https://canvasui.dev/r/asciify-preact-webgpu.json Redraws your page as live ascii characters in a soft radius around the cursor, with real glyph, shade block, and binary ramps. The HTML stays interactive in Ch…
npx shadcn@latest add https://canvasui.dev/r/asciify-vanilla-webgpu.json Folds the top and bottom of your page over virtual edges as you scroll, like scrolling on the face of a cube. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/bend-react.json Folds the top and bottom of your page over virtual edges as you scroll, like scrolling on the face of a cube. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/bend-vue.json Folds the top and bottom of your page over virtual edges as you scroll, like scrolling on the face of a cube. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/bend-svelte.json Folds the top and bottom of your page over virtual edges as you scroll, like scrolling on the face of a cube. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/bend-solid.json Folds the top and bottom of your page over virtual edges as you scroll, like scrolling on the face of a cube. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/bend-preact.json Folds the top and bottom of your page over virtual edges as you scroll, like scrolling on the face of a cube. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/bend-vanilla.json Folds the top and bottom of your page over virtual edges as you scroll, like scrolling on the face of a cube. The HTML stays interactive. No dependencies. WebG…
npx shadcn@latest add https://canvasui.dev/r/bend-react-webgpu.json Folds the top and bottom of your page over virtual edges as you scroll, like scrolling on the face of a cube. The HTML stays interactive. No dependencies. WebG…
npx shadcn@latest add https://canvasui.dev/r/bend-vue-webgpu.json Folds the top and bottom of your page over virtual edges as you scroll, like scrolling on the face of a cube. The HTML stays interactive. No dependencies. WebG…
npx shadcn@latest add https://canvasui.dev/r/bend-svelte-webgpu.json Folds the top and bottom of your page over virtual edges as you scroll, like scrolling on the face of a cube. The HTML stays interactive. No dependencies. WebG…
npx shadcn@latest add https://canvasui.dev/r/bend-solid-webgpu.json Folds the top and bottom of your page over virtual edges as you scroll, like scrolling on the face of a cube. The HTML stays interactive. No dependencies. WebG…
npx shadcn@latest add https://canvasui.dev/r/bend-preact-webgpu.json Folds the top and bottom of your page over virtual edges as you scroll, like scrolling on the face of a cube. The HTML stays interactive. No dependencies. WebG…
npx shadcn@latest add https://canvasui.dev/r/bend-vanilla-webgpu.json Splits your page into a grid of 3D tiles that ripple in waves around the cursor. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/grid-react.json Splits your page into a grid of 3D tiles that ripple in waves around the cursor. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/grid-vue.json Splits your page into a grid of 3D tiles that ripple in waves around the cursor. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/grid-svelte.json Splits your page into a grid of 3D tiles that ripple in waves around the cursor. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/grid-solid.json Splits your page into a grid of 3D tiles that ripple in waves around the cursor. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/grid-preact.json Splits your page into a grid of 3D tiles that ripple in waves around the cursor. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/grid-vanilla.json Splits your page into a grid of 3D tiles that ripple in waves around the cursor. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/grid-react-webgpu.json Splits your page into a grid of 3D tiles that ripple in waves around the cursor. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/grid-vue-webgpu.json Splits your page into a grid of 3D tiles that ripple in waves around the cursor. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/grid-svelte-webgpu.json Splits your page into a grid of 3D tiles that ripple in waves around the cursor. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/grid-solid-webgpu.json Splits your page into a grid of 3D tiles that ripple in waves around the cursor. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/grid-preact-webgpu.json Splits your page into a grid of 3D tiles that ripple in waves around the cursor. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/grid-vanilla-webgpu.json Fire sparks, smoke, and heat distortion rising from the bottom of your page. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/blaze-react.json Fire sparks, smoke, and heat distortion rising from the bottom of your page. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/blaze-vue.json Fire sparks, smoke, and heat distortion rising from the bottom of your page. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/blaze-svelte.json Fire sparks, smoke, and heat distortion rising from the bottom of your page. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/blaze-solid.json Fire sparks, smoke, and heat distortion rising from the bottom of your page. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/blaze-preact.json Fire sparks, smoke, and heat distortion rising from the bottom of your page. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/blaze-vanilla.json Fire sparks, smoke, and heat distortion rising from the bottom of your page. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/blaze-react-webgpu.json Fire sparks, smoke, and heat distortion rising from the bottom of your page. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/blaze-vue-webgpu.json Fire sparks, smoke, and heat distortion rising from the bottom of your page. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/blaze-svelte-webgpu.json Fire sparks, smoke, and heat distortion rising from the bottom of your page. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/blaze-solid-webgpu.json Fire sparks, smoke, and heat distortion rising from the bottom of your page. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/blaze-preact-webgpu.json Fire sparks, smoke, and heat distortion rising from the bottom of your page. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/blaze-vanilla-webgpu.json A glassy droplet that trails the cursor as blending metaballs and refracts the live page beneath it, with dispersion, frost, and an iridescent sheen. The HTML …
npx shadcn@latest add https://canvasui.dev/r/bubble-react.json A glassy droplet that trails the cursor as blending metaballs and refracts the live page beneath it, with dispersion, frost, and an iridescent sheen. The HTML …
npx shadcn@latest add https://canvasui.dev/r/bubble-vue.json A glassy droplet that trails the cursor as blending metaballs and refracts the live page beneath it, with dispersion, frost, and an iridescent sheen. The HTML …
npx shadcn@latest add https://canvasui.dev/r/bubble-svelte.json A glassy droplet that trails the cursor as blending metaballs and refracts the live page beneath it, with dispersion, frost, and an iridescent sheen. The HTML …
npx shadcn@latest add https://canvasui.dev/r/bubble-solid.json A glassy droplet that trails the cursor as blending metaballs and refracts the live page beneath it, with dispersion, frost, and an iridescent sheen. The HTML …
npx shadcn@latest add https://canvasui.dev/r/bubble-preact.json A glassy droplet that trails the cursor as blending metaballs and refracts the live page beneath it, with dispersion, frost, and an iridescent sheen. The HTML …
npx shadcn@latest add https://canvasui.dev/r/bubble-vanilla.json A glassy droplet that trails the cursor as blending metaballs and refracts the live page beneath it, with dispersion, frost, and an iridescent sheen. The HTML …
npx shadcn@latest add https://canvasui.dev/r/bubble-react-webgpu.json A glassy droplet that trails the cursor as blending metaballs and refracts the live page beneath it, with dispersion, frost, and an iridescent sheen. The HTML …
npx shadcn@latest add https://canvasui.dev/r/bubble-vue-webgpu.json A glassy droplet that trails the cursor as blending metaballs and refracts the live page beneath it, with dispersion, frost, and an iridescent sheen. The HTML …
npx shadcn@latest add https://canvasui.dev/r/bubble-svelte-webgpu.json A glassy droplet that trails the cursor as blending metaballs and refracts the live page beneath it, with dispersion, frost, and an iridescent sheen. The HTML …
npx shadcn@latest add https://canvasui.dev/r/bubble-solid-webgpu.json A glassy droplet that trails the cursor as blending metaballs and refracts the live page beneath it, with dispersion, frost, and an iridescent sheen. The HTML …
npx shadcn@latest add https://canvasui.dev/r/bubble-preact-webgpu.json A glassy droplet that trails the cursor as blending metaballs and refracts the live page beneath it, with dispersion, frost, and an iridescent sheen. The HTML …
npx shadcn@latest add https://canvasui.dev/r/bubble-vanilla-webgpu.json Paints your page onto woven artist canvas, with fiber texture, paper tint, grain, a dotted halftone screen, and a soft intro crossfade. Text stays crisp and re…
npx shadcn@latest add https://canvasui.dev/r/canvas-react.json Paints your page onto woven artist canvas, with fiber texture, paper tint, grain, a dotted halftone screen, and a soft intro crossfade. Text stays crisp and re…
npx shadcn@latest add https://canvasui.dev/r/canvas-vue.json Paints your page onto woven artist canvas, with fiber texture, paper tint, grain, a dotted halftone screen, and a soft intro crossfade. Text stays crisp and re…
npx shadcn@latest add https://canvasui.dev/r/canvas-svelte.json Paints your page onto woven artist canvas, with fiber texture, paper tint, grain, a dotted halftone screen, and a soft intro crossfade. Text stays crisp and re…
npx shadcn@latest add https://canvasui.dev/r/canvas-solid.json Paints your page onto woven artist canvas, with fiber texture, paper tint, grain, a dotted halftone screen, and a soft intro crossfade. Text stays crisp and re…
npx shadcn@latest add https://canvasui.dev/r/canvas-preact.json Paints your page onto woven artist canvas, with fiber texture, paper tint, grain, a dotted halftone screen, and a soft intro crossfade. Text stays crisp and re…
npx shadcn@latest add https://canvasui.dev/r/canvas-vanilla.json Paints your page onto woven artist canvas, with fiber texture, paper tint, grain, a dotted halftone screen, and a soft intro crossfade. Text stays crisp and re…
npx shadcn@latest add https://canvasui.dev/r/canvas-react-webgpu.json Paints your page onto woven artist canvas, with fiber texture, paper tint, grain, a dotted halftone screen, and a soft intro crossfade. Text stays crisp and re…
npx shadcn@latest add https://canvasui.dev/r/canvas-vue-webgpu.json Paints your page onto woven artist canvas, with fiber texture, paper tint, grain, a dotted halftone screen, and a soft intro crossfade. Text stays crisp and re…
npx shadcn@latest add https://canvasui.dev/r/canvas-svelte-webgpu.json Paints your page onto woven artist canvas, with fiber texture, paper tint, grain, a dotted halftone screen, and a soft intro crossfade. Text stays crisp and re…
npx shadcn@latest add https://canvasui.dev/r/canvas-solid-webgpu.json Paints your page onto woven artist canvas, with fiber texture, paper tint, grain, a dotted halftone screen, and a soft intro crossfade. Text stays crisp and re…
npx shadcn@latest add https://canvasui.dev/r/canvas-preact-webgpu.json Paints your page onto woven artist canvas, with fiber texture, paper tint, grain, a dotted halftone screen, and a soft intro crossfade. Text stays crisp and re…
npx shadcn@latest add https://canvasui.dev/r/canvas-vanilla-webgpu.json Hangs your live HTML on a piece of fabric rippling in the wind, with softly lit folds. Cursor strokes send waves across the cloth. The HTML stays interactive. …
npx shadcn@latest add https://canvasui.dev/r/cloth-react.json Hangs your live HTML on a piece of fabric rippling in the wind, with softly lit folds. Cursor strokes send waves across the cloth. The HTML stays interactive. …
npx shadcn@latest add https://canvasui.dev/r/cloth-vue.json Hangs your live HTML on a piece of fabric rippling in the wind, with softly lit folds. Cursor strokes send waves across the cloth. The HTML stays interactive. …
npx shadcn@latest add https://canvasui.dev/r/cloth-svelte.json Hangs your live HTML on a piece of fabric rippling in the wind, with softly lit folds. Cursor strokes send waves across the cloth. The HTML stays interactive. …
npx shadcn@latest add https://canvasui.dev/r/cloth-solid.json Hangs your live HTML on a piece of fabric rippling in the wind, with softly lit folds. Cursor strokes send waves across the cloth. The HTML stays interactive. …
npx shadcn@latest add https://canvasui.dev/r/cloth-preact.json Hangs your live HTML on a piece of fabric rippling in the wind, with softly lit folds. Cursor strokes send waves across the cloth. The HTML stays interactive. …
npx shadcn@latest add https://canvasui.dev/r/cloth-vanilla.json Hangs your live HTML on a piece of fabric rippling in the wind, with softly lit folds. Cursor strokes send waves across the cloth. The HTML stays interactive. …
npx shadcn@latest add https://canvasui.dev/r/cloth-react-webgpu.json Hangs your live HTML on a piece of fabric rippling in the wind, with softly lit folds. Cursor strokes send waves across the cloth. The HTML stays interactive. …
npx shadcn@latest add https://canvasui.dev/r/cloth-vue-webgpu.json Hangs your live HTML on a piece of fabric rippling in the wind, with softly lit folds. Cursor strokes send waves across the cloth. The HTML stays interactive. …
npx shadcn@latest add https://canvasui.dev/r/cloth-svelte-webgpu.json Hangs your live HTML on a piece of fabric rippling in the wind, with softly lit folds. Cursor strokes send waves across the cloth. The HTML stays interactive. …
npx shadcn@latest add https://canvasui.dev/r/cloth-solid-webgpu.json Hangs your live HTML on a piece of fabric rippling in the wind, with softly lit folds. Cursor strokes send waves across the cloth. The HTML stays interactive. …
npx shadcn@latest add https://canvasui.dev/r/cloth-preact-webgpu.json Hangs your live HTML on a piece of fabric rippling in the wind, with softly lit folds. Cursor strokes send waves across the cloth. The HTML stays interactive. …
npx shadcn@latest add https://canvasui.dev/r/cloth-vanilla-webgpu.json Procedural fog that drifts over your page and blurs what it covers. Cursor movement parts the clouds. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/clouds-react.json Procedural fog that drifts over your page and blurs what it covers. Cursor movement parts the clouds. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/clouds-vue.json Procedural fog that drifts over your page and blurs what it covers. Cursor movement parts the clouds. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/clouds-svelte.json Procedural fog that drifts over your page and blurs what it covers. Cursor movement parts the clouds. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/clouds-solid.json Procedural fog that drifts over your page and blurs what it covers. Cursor movement parts the clouds. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/clouds-preact.json Procedural fog that drifts over your page and blurs what it covers. Cursor movement parts the clouds. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/clouds-vanilla.json Procedural fog that drifts over your page and blurs what it covers. Cursor movement parts the clouds. The HTML stays interactive. No dependencies. WebGPU build…
npx shadcn@latest add https://canvasui.dev/r/clouds-react-webgpu.json Procedural fog that drifts over your page and blurs what it covers. Cursor movement parts the clouds. The HTML stays interactive. No dependencies. WebGPU build…
npx shadcn@latest add https://canvasui.dev/r/clouds-vue-webgpu.json Procedural fog that drifts over your page and blurs what it covers. Cursor movement parts the clouds. The HTML stays interactive. No dependencies. WebGPU build…
npx shadcn@latest add https://canvasui.dev/r/clouds-svelte-webgpu.json Procedural fog that drifts over your page and blurs what it covers. Cursor movement parts the clouds. The HTML stays interactive. No dependencies. WebGPU build…
npx shadcn@latest add https://canvasui.dev/r/clouds-solid-webgpu.json Procedural fog that drifts over your page and blurs what it covers. Cursor movement parts the clouds. The HTML stays interactive. No dependencies. WebGPU build…
npx shadcn@latest add https://canvasui.dev/r/clouds-preact-webgpu.json Procedural fog that drifts over your page and blurs what it covers. Cursor movement parts the clouds. The HTML stays interactive. No dependencies. WebGPU build…
npx shadcn@latest add https://canvasui.dev/r/clouds-vanilla-webgpu.json Renders your page as real ASCII cipher text that decodes back into crisp UI around the cursor behind a flickering wavefront. The HTML stays interactive. No dep…
npx shadcn@latest add https://canvasui.dev/r/decrypt-reveal-react.json Renders your page as real ASCII cipher text that decodes back into crisp UI around the cursor behind a flickering wavefront. The HTML stays interactive. No dep…
npx shadcn@latest add https://canvasui.dev/r/decrypt-reveal-vue.json Renders your page as real ASCII cipher text that decodes back into crisp UI around the cursor behind a flickering wavefront. The HTML stays interactive. No dep…
npx shadcn@latest add https://canvasui.dev/r/decrypt-reveal-svelte.json Renders your page as real ASCII cipher text that decodes back into crisp UI around the cursor behind a flickering wavefront. The HTML stays interactive. No dep…
npx shadcn@latest add https://canvasui.dev/r/decrypt-reveal-solid.json Renders your page as real ASCII cipher text that decodes back into crisp UI around the cursor behind a flickering wavefront. The HTML stays interactive. No dep…
npx shadcn@latest add https://canvasui.dev/r/decrypt-reveal-preact.json Renders your page as real ASCII cipher text that decodes back into crisp UI around the cursor behind a flickering wavefront. The HTML stays interactive. No dep…
npx shadcn@latest add https://canvasui.dev/r/decrypt-reveal-vanilla.json Renders your page as real ASCII cipher text that decodes back into crisp UI around the cursor behind a flickering wavefront. The HTML stays interactive. No dep…
npx shadcn@latest add https://canvasui.dev/r/decrypt-reveal-react-webgpu.json Renders your page as real ASCII cipher text that decodes back into crisp UI around the cursor behind a flickering wavefront. The HTML stays interactive. No dep…
npx shadcn@latest add https://canvasui.dev/r/decrypt-reveal-vue-webgpu.json Renders your page as real ASCII cipher text that decodes back into crisp UI around the cursor behind a flickering wavefront. The HTML stays interactive. No dep…
npx shadcn@latest add https://canvasui.dev/r/decrypt-reveal-svelte-webgpu.json Renders your page as real ASCII cipher text that decodes back into crisp UI around the cursor behind a flickering wavefront. The HTML stays interactive. No dep…
npx shadcn@latest add https://canvasui.dev/r/decrypt-reveal-solid-webgpu.json Renders your page as real ASCII cipher text that decodes back into crisp UI around the cursor behind a flickering wavefront. The HTML stays interactive. No dep…
npx shadcn@latest add https://canvasui.dev/r/decrypt-reveal-preact-webgpu.json Renders your page as real ASCII cipher text that decodes back into crisp UI around the cursor behind a flickering wavefront. The HTML stays interactive. No dep…
npx shadcn@latest add https://canvasui.dev/r/decrypt-reveal-vanilla-webgpu.json A pointer-driven GPU fluid simulation over your page. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/liquid-react.json A pointer-driven GPU fluid simulation over your page. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/liquid-vue.json A pointer-driven GPU fluid simulation over your page. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/liquid-svelte.json A pointer-driven GPU fluid simulation over your page. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/liquid-solid.json A pointer-driven GPU fluid simulation over your page. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/liquid-preact.json A pointer-driven GPU fluid simulation over your page. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/liquid-vanilla.json A pointer-driven GPU fluid simulation over your page. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/liquid-react-webgpu.json A pointer-driven GPU fluid simulation over your page. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/liquid-vue-webgpu.json A pointer-driven GPU fluid simulation over your page. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/liquid-svelte-webgpu.json A pointer-driven GPU fluid simulation over your page. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/liquid-solid-webgpu.json A pointer-driven GPU fluid simulation over your page. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/liquid-preact-webgpu.json A pointer-driven GPU fluid simulation over your page. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/liquid-vanilla-webgpu.json A sci-fi scanner lens that follows the cursor and magnifies the live page inside a configurable HUD reticle, with chromatic aberration haze and click ripples t…
npx shadcn@latest add https://canvasui.dev/r/magnify-react.json A sci-fi scanner lens that follows the cursor and magnifies the live page inside a configurable HUD reticle, with chromatic aberration haze and click ripples t…
npx shadcn@latest add https://canvasui.dev/r/magnify-vue.json A sci-fi scanner lens that follows the cursor and magnifies the live page inside a configurable HUD reticle, with chromatic aberration haze and click ripples t…
npx shadcn@latest add https://canvasui.dev/r/magnify-svelte.json A sci-fi scanner lens that follows the cursor and magnifies the live page inside a configurable HUD reticle, with chromatic aberration haze and click ripples t…
npx shadcn@latest add https://canvasui.dev/r/magnify-solid.json A sci-fi scanner lens that follows the cursor and magnifies the live page inside a configurable HUD reticle, with chromatic aberration haze and click ripples t…
npx shadcn@latest add https://canvasui.dev/r/magnify-preact.json A sci-fi scanner lens that follows the cursor and magnifies the live page inside a configurable HUD reticle, with chromatic aberration haze and click ripples t…
npx shadcn@latest add https://canvasui.dev/r/magnify-vanilla.json A sci-fi scanner lens that follows the cursor and magnifies the live page inside a configurable HUD reticle, with chromatic aberration haze and click ripples t…
npx shadcn@latest add https://canvasui.dev/r/magnify-react-webgpu.json A sci-fi scanner lens that follows the cursor and magnifies the live page inside a configurable HUD reticle, with chromatic aberration haze and click ripples t…
npx shadcn@latest add https://canvasui.dev/r/magnify-vue-webgpu.json A sci-fi scanner lens that follows the cursor and magnifies the live page inside a configurable HUD reticle, with chromatic aberration haze and click ripples t…
npx shadcn@latest add https://canvasui.dev/r/magnify-svelte-webgpu.json A sci-fi scanner lens that follows the cursor and magnifies the live page inside a configurable HUD reticle, with chromatic aberration haze and click ripples t…
npx shadcn@latest add https://canvasui.dev/r/magnify-solid-webgpu.json A sci-fi scanner lens that follows the cursor and magnifies the live page inside a configurable HUD reticle, with chromatic aberration haze and click ripples t…
npx shadcn@latest add https://canvasui.dev/r/magnify-preact-webgpu.json A sci-fi scanner lens that follows the cursor and magnifies the live page inside a configurable HUD reticle, with chromatic aberration haze and click ripples t…
npx shadcn@latest add https://canvasui.dev/r/magnify-vanilla-webgpu.json Renders any GLB/glTF model, SVG, or image in a floating studio scene through a 1-bit Bayer, halftone, or Floyd–Steinberg dither. Built on three.js.
npx shadcn@latest add https://canvasui.dev/r/dithered-object-react.json Renders any GLB/glTF model, SVG, or image in a floating studio scene through a 1-bit Bayer, halftone, or Floyd–Steinberg dither. Built on three.js.
npx shadcn@latest add https://canvasui.dev/r/dithered-object-vue.json Renders any GLB/glTF model, SVG, or image in a floating studio scene through a 1-bit Bayer, halftone, or Floyd–Steinberg dither. Built on three.js.
npx shadcn@latest add https://canvasui.dev/r/dithered-object-svelte.json Renders any GLB/glTF model, SVG, or image in a floating studio scene through a 1-bit Bayer, halftone, or Floyd–Steinberg dither. Built on three.js.
npx shadcn@latest add https://canvasui.dev/r/dithered-object-solid.json Renders any GLB/glTF model, SVG, or image in a floating studio scene through a 1-bit Bayer, halftone, or Floyd–Steinberg dither. Built on three.js.
npx shadcn@latest add https://canvasui.dev/r/dithered-object-preact.json Renders any GLB/glTF model, SVG, or image in a floating studio scene through a 1-bit Bayer, halftone, or Floyd–Steinberg dither. Built on three.js.
npx shadcn@latest add https://canvasui.dev/r/dithered-object-vanilla.json Renders any GLB/glTF model, SVG, or image in a floating studio scene through a 1-bit Bayer, halftone, or Floyd–Steinberg dither. Built on three.js. WebGPU buil…
npx shadcn@latest add https://canvasui.dev/r/dithered-object-react-webgpu.json Renders any GLB/glTF model, SVG, or image in a floating studio scene through a 1-bit Bayer, halftone, or Floyd–Steinberg dither. Built on three.js. WebGPU buil…
npx shadcn@latest add https://canvasui.dev/r/dithered-object-vue-webgpu.json Renders any GLB/glTF model, SVG, or image in a floating studio scene through a 1-bit Bayer, halftone, or Floyd–Steinberg dither. Built on three.js. WebGPU buil…
npx shadcn@latest add https://canvasui.dev/r/dithered-object-svelte-webgpu.json Renders any GLB/glTF model, SVG, or image in a floating studio scene through a 1-bit Bayer, halftone, or Floyd–Steinberg dither. Built on three.js. WebGPU buil…
npx shadcn@latest add https://canvasui.dev/r/dithered-object-solid-webgpu.json Renders any GLB/glTF model, SVG, or image in a floating studio scene through a 1-bit Bayer, halftone, or Floyd–Steinberg dither. Built on three.js. WebGPU buil…
npx shadcn@latest add https://canvasui.dev/r/dithered-object-preact-webgpu.json Renders any GLB/glTF model, SVG, or image in a floating studio scene through a 1-bit Bayer, halftone, or Floyd–Steinberg dither. Built on three.js. WebGPU buil…
npx shadcn@latest add https://canvasui.dev/r/dithered-object-vanilla-webgpu.json Warps your live HTML on a displacement grid that ripples away from the cursor, with chromatic fringing and film grain in the disturbed areas. The HTML stays in…
npx shadcn@latest add https://canvasui.dev/r/displacement-react.json Warps your live HTML on a displacement grid that ripples away from the cursor, with chromatic fringing and film grain in the disturbed areas. The HTML stays in…
npx shadcn@latest add https://canvasui.dev/r/displacement-vue.json Warps your live HTML on a displacement grid that ripples away from the cursor, with chromatic fringing and film grain in the disturbed areas. The HTML stays in…
npx shadcn@latest add https://canvasui.dev/r/displacement-svelte.json Warps your live HTML on a displacement grid that ripples away from the cursor, with chromatic fringing and film grain in the disturbed areas. The HTML stays in…
npx shadcn@latest add https://canvasui.dev/r/displacement-solid.json Warps your live HTML on a displacement grid that ripples away from the cursor, with chromatic fringing and film grain in the disturbed areas. The HTML stays in…
npx shadcn@latest add https://canvasui.dev/r/displacement-preact.json Warps your live HTML on a displacement grid that ripples away from the cursor, with chromatic fringing and film grain in the disturbed areas. The HTML stays in…
npx shadcn@latest add https://canvasui.dev/r/displacement-vanilla.json Warps your live HTML on a displacement grid that ripples away from the cursor, with chromatic fringing and film grain in the disturbed areas. The HTML stays in…
npx shadcn@latest add https://canvasui.dev/r/displacement-react-webgpu.json Warps your live HTML on a displacement grid that ripples away from the cursor, with chromatic fringing and film grain in the disturbed areas. The HTML stays in…
npx shadcn@latest add https://canvasui.dev/r/displacement-vue-webgpu.json Warps your live HTML on a displacement grid that ripples away from the cursor, with chromatic fringing and film grain in the disturbed areas. The HTML stays in…
npx shadcn@latest add https://canvasui.dev/r/displacement-svelte-webgpu.json Warps your live HTML on a displacement grid that ripples away from the cursor, with chromatic fringing and film grain in the disturbed areas. The HTML stays in…
npx shadcn@latest add https://canvasui.dev/r/displacement-solid-webgpu.json Warps your live HTML on a displacement grid that ripples away from the cursor, with chromatic fringing and film grain in the disturbed areas. The HTML stays in…
npx shadcn@latest add https://canvasui.dev/r/displacement-preact-webgpu.json Warps your live HTML on a displacement grid that ripples away from the cursor, with chromatic fringing and film grain in the disturbed areas. The HTML stays in…
npx shadcn@latest add https://canvasui.dev/r/displacement-vanilla-webgpu.json Rain droplets that run down the screen and refract your page behind them. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/droplets-react.json Rain droplets that run down the screen and refract your page behind them. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/droplets-vue.json Rain droplets that run down the screen and refract your page behind them. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/droplets-svelte.json Rain droplets that run down the screen and refract your page behind them. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/droplets-solid.json Rain droplets that run down the screen and refract your page behind them. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/droplets-preact.json Rain droplets that run down the screen and refract your page behind them. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/droplets-vanilla.json Rain droplets that run down the screen and refract your page behind them. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/droplets-react-webgpu.json Rain droplets that run down the screen and refract your page behind them. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/droplets-vue-webgpu.json Rain droplets that run down the screen and refract your page behind them. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/droplets-svelte-webgpu.json Rain droplets that run down the screen and refract your page behind them. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/droplets-solid-webgpu.json Rain droplets that run down the screen and refract your page behind them. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/droplets-preact-webgpu.json Rain droplets that run down the screen and refract your page behind them. The HTML stays interactive. No dependencies. WebGPU build, rendered with vgpu.
npx shadcn@latest add https://canvasui.dev/r/droplets-vanilla-webgpu.json Wraps any element in a perfectly aligned border of fire: flames rise from the top edge, the outline glows molten, sparks fly, and the content shimmers with hea…
npx shadcn@latest add https://canvasui.dev/r/flame-wrap-react.json Wraps any element in a perfectly aligned border of fire: flames rise from the top edge, the outline glows molten, sparks fly, and the content shimmers with hea…
npx shadcn@latest add https://canvasui.dev/r/flame-wrap-vue.json Wraps any element in a perfectly aligned border of fire: flames rise from the top edge, the outline glows molten, sparks fly, and the content shimmers with hea…
npx shadcn@latest add https://canvasui.dev/r/flame-wrap-svelte.json Wraps any element in a perfectly aligned border of fire: flames rise from the top edge, the outline glows molten, sparks fly, and the content shimmers with hea…
npx shadcn@latest add https://canvasui.dev/r/flame-wrap-solid.json Wraps any element in a perfectly aligned border of fire: flames rise from the top edge, the outline glows molten, sparks fly, and the content shimmers with hea…
npx shadcn@latest add https://canvasui.dev/r/flame-wrap-preact.json Wraps any element in a perfectly aligned border of fire: flames rise from the top edge, the outline glows molten, sparks fly, and the content shimmers with hea…
npx shadcn@latest add https://canvasui.dev/r/flame-wrap-vanilla.json Wraps any element in a perfectly aligned border of fire: flames rise from the top edge, the outline glows molten, sparks fly, and the content shimmers with hea…
npx shadcn@latest add https://canvasui.dev/r/flame-wrap-react-webgpu.json Wraps any element in a perfectly aligned border of fire: flames rise from the top edge, the outline glows molten, sparks fly, and the content shimmers with hea…
npx shadcn@latest add https://canvasui.dev/r/flame-wrap-vue-webgpu.json Wraps any element in a perfectly aligned border of fire: flames rise from the top edge, the outline glows molten, sparks fly, and the content shimmers with hea…
npx shadcn@latest add https://canvasui.dev/r/flame-wrap-svelte-webgpu.json Wraps any element in a perfectly aligned border of fire: flames rise from the top edge, the outline glows molten, sparks fly, and the content shimmers with hea…
npx shadcn@latest add https://canvasui.dev/r/flame-wrap-solid-webgpu.json Wraps any element in a perfectly aligned border of fire: flames rise from the top edge, the outline glows molten, sparks fly, and the content shimmers with hea…
npx shadcn@latest add https://canvasui.dev/r/flame-wrap-preact-webgpu.json Wraps any element in a perfectly aligned border of fire: flames rise from the top edge, the outline glows molten, sparks fly, and the content shimmers with hea…
npx shadcn@latest add https://canvasui.dev/r/flame-wrap-vanilla-webgpu.json Projects an energy shield lattice over your live HTML. The cursor charges cells as it crosses them and every click detonates a shockwave ripple that refracts t…
npx shadcn@latest add https://canvasui.dev/r/force-field-react.json Projects an energy shield lattice over your live HTML. The cursor charges cells as it crosses them and every click detonates a shockwave ripple that refracts t…
npx shadcn@latest add https://canvasui.dev/r/force-field-vue.json Projects an energy shield lattice over your live HTML. The cursor charges cells as it crosses them and every click detonates a shockwave ripple that refracts t…
npx shadcn@latest add https://canvasui.dev/r/force-field-svelte.json Projects an energy shield lattice over your live HTML. The cursor charges cells as it crosses them and every click detonates a shockwave ripple that refracts t…
npx shadcn@latest add https://canvasui.dev/r/force-field-solid.json Projects an energy shield lattice over your live HTML. The cursor charges cells as it crosses them and every click detonates a shockwave ripple that refracts t…
npx shadcn@latest add https://canvasui.dev/r/force-field-preact.json Projects an energy shield lattice over your live HTML. The cursor charges cells as it crosses them and every click detonates a shockwave ripple that refracts t…
npx shadcn@latest add https://canvasui.dev/r/force-field-vanilla.json Projects an energy shield lattice over your live HTML. The cursor charges cells as it crosses them and every click detonates a shockwave ripple that refracts t…
npx shadcn@latest add https://canvasui.dev/r/force-field-react-webgpu.json Projects an energy shield lattice over your live HTML. The cursor charges cells as it crosses them and every click detonates a shockwave ripple that refracts t…
npx shadcn@latest add https://canvasui.dev/r/force-field-vue-webgpu.json Projects an energy shield lattice over your live HTML. The cursor charges cells as it crosses them and every click detonates a shockwave ripple that refracts t…
npx shadcn@latest add https://canvasui.dev/r/force-field-svelte-webgpu.json Projects an energy shield lattice over your live HTML. The cursor charges cells as it crosses them and every click detonates a shockwave ripple that refracts t…
npx shadcn@latest add https://canvasui.dev/r/force-field-solid-webgpu.json Projects an energy shield lattice over your live HTML. The cursor charges cells as it crosses them and every click detonates a shockwave ripple that refracts t…
npx shadcn@latest add https://canvasui.dev/r/force-field-preact-webgpu.json Projects an energy shield lattice over your live HTML. The cursor charges cells as it crosses them and every click detonates a shockwave ripple that refracts t…
npx shadcn@latest add https://canvasui.dev/r/force-field-vanilla-webgpu.json Rebuilds any GLB/glTF model, SVG, or image as a cloud of particles that the cursor pushes, swirls, and springs back into shape. Built on three.js.
npx shadcn@latest add https://canvasui.dev/r/particle-object-react.json Rebuilds any GLB/glTF model, SVG, or image as a cloud of particles that the cursor pushes, swirls, and springs back into shape. Built on three.js.
npx shadcn@latest add https://canvasui.dev/r/particle-object-vue.json Rebuilds any GLB/glTF model, SVG, or image as a cloud of particles that the cursor pushes, swirls, and springs back into shape. Built on three.js.
npx shadcn@latest add https://canvasui.dev/r/particle-object-svelte.json Rebuilds any GLB/glTF model, SVG, or image as a cloud of particles that the cursor pushes, swirls, and springs back into shape. Built on three.js.
npx shadcn@latest add https://canvasui.dev/r/particle-object-solid.json Rebuilds any GLB/glTF model, SVG, or image as a cloud of particles that the cursor pushes, swirls, and springs back into shape. Built on three.js.
npx shadcn@latest add https://canvasui.dev/r/particle-object-preact.json Rebuilds any GLB/glTF model, SVG, or image as a cloud of particles that the cursor pushes, swirls, and springs back into shape. Built on three.js.
npx shadcn@latest add https://canvasui.dev/r/particle-object-vanilla.json Rebuilds any GLB/glTF model, SVG, or image as a cloud of particles that the cursor pushes, swirls, and springs back into shape. Built on three.js. WebGPU build…
npx shadcn@latest add https://canvasui.dev/r/particle-object-react-webgpu.json Rebuilds any GLB/glTF model, SVG, or image as a cloud of particles that the cursor pushes, swirls, and springs back into shape. Built on three.js. WebGPU build…
npx shadcn@latest add https://canvasui.dev/r/particle-object-vue-webgpu.json Rebuilds any GLB/glTF model, SVG, or image as a cloud of particles that the cursor pushes, swirls, and springs back into shape. Built on three.js. WebGPU build…
npx shadcn@latest add https://canvasui.dev/r/particle-object-svelte-webgpu.json Rebuilds any GLB/glTF model, SVG, or image as a cloud of particles that the cursor pushes, swirls, and springs back into shape. Built on three.js. WebGPU build…
npx shadcn@latest add https://canvasui.dev/r/particle-object-solid-webgpu.json Rebuilds any GLB/glTF model, SVG, or image as a cloud of particles that the cursor pushes, swirls, and springs back into shape. Built on three.js. WebGPU build…
npx shadcn@latest add https://canvasui.dev/r/particle-object-preact-webgpu.json Rebuilds any GLB/glTF model, SVG, or image as a cloud of particles that the cursor pushes, swirls, and springs back into shape. Built on three.js. WebGPU build…
npx shadcn@latest add https://canvasui.dev/r/particle-object-vanilla-webgpu.json Renders your page as fine grayscale dust that merges back into crisp UI around the cursor. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/particle-reveal-react.json Renders your page as fine grayscale dust that merges back into crisp UI around the cursor. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/particle-reveal-vue.json Renders your page as fine grayscale dust that merges back into crisp UI around the cursor. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/particle-reveal-svelte.json Renders your page as fine grayscale dust that merges back into crisp UI around the cursor. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/particle-reveal-solid.json Renders your page as fine grayscale dust that merges back into crisp UI around the cursor. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/particle-reveal-preact.json Renders your page as fine grayscale dust that merges back into crisp UI around the cursor. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/particle-reveal-vanilla.json Renders your page as fine grayscale dust that merges back into crisp UI around the cursor. The HTML stays interactive. No dependencies. WebGPU build, rendered …
npx shadcn@latest add https://canvasui.dev/r/particle-reveal-react-webgpu.json Renders your page as fine grayscale dust that merges back into crisp UI around the cursor. The HTML stays interactive. No dependencies. WebGPU build, rendered …
npx shadcn@latest add https://canvasui.dev/r/particle-reveal-vue-webgpu.json Renders your page as fine grayscale dust that merges back into crisp UI around the cursor. The HTML stays interactive. No dependencies. WebGPU build, rendered …
npx shadcn@latest add https://canvasui.dev/r/particle-reveal-svelte-webgpu.json Renders your page as fine grayscale dust that merges back into crisp UI around the cursor. The HTML stays interactive. No dependencies. WebGPU build, rendered …
npx shadcn@latest add https://canvasui.dev/r/particle-reveal-solid-webgpu.json Renders your page as fine grayscale dust that merges back into crisp UI around the cursor. The HTML stays interactive. No dependencies. WebGPU build, rendered …
npx shadcn@latest add https://canvasui.dev/r/particle-reveal-preact-webgpu.json Renders your page as fine grayscale dust that merges back into crisp UI around the cursor. The HTML stays interactive. No dependencies. WebGPU build, rendered …
npx shadcn@latest add https://canvasui.dev/r/particle-reveal-vanilla-webgpu.json Dissolves everything below a chosen line into drifting sand that reassembles as you scroll. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/particle-scroll-react.json Dissolves everything below a chosen line into drifting sand that reassembles as you scroll. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/particle-scroll-vue.json Dissolves everything below a chosen line into drifting sand that reassembles as you scroll. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/particle-scroll-svelte.json Dissolves everything below a chosen line into drifting sand that reassembles as you scroll. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/particle-scroll-solid.json Dissolves everything below a chosen line into drifting sand that reassembles as you scroll. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/particle-scroll-preact.json Dissolves everything below a chosen line into drifting sand that reassembles as you scroll. The HTML stays interactive. No dependencies.
npx shadcn@latest add https://canvasui.dev/r/particle-scroll-vanilla.json Dissolves everything below a chosen line into drifting sand that reassembles as you scroll. The HTML stays interactive. No dependencies. WebGPU build, rendered…
npx shadcn@latest add https://canvasui.dev/r/particle-scroll-react-webgpu.json Dissolves everything below a chosen line into drifting sand that reassembles as you scroll. The HTML stays interactive. No dependencies. WebGPU build, rendered…
npx shadcn@latest add https://canvasui.dev/r/particle-scroll-vue-webgpu.json Dissolves everything below a chosen line into drifting sand that reassembles as you scroll. The HTML stays interactive. No dependencies. WebGPU build, rendered…
npx shadcn@latest add https://canvasui.dev/r/particle-scroll-svelte-webgpu.json Dissolves everything below a chosen line into drifting sand that reassembles as you scroll. The HTML stays interactive. No dependencies. WebGPU build, rendered…
npx shadcn@latest add https://canvasui.dev/r/particle-scroll-solid-webgpu.json