Loading video...

Video Failed to Load

There was a problem loading this video. This could be due to a temporary network issue or the video might be unavailable.

GPU Canvas is now live for everyone. Rive's low-level GPU layer for 3D, shaders, and custom effects is out of Early Access and in the production editor today. Write your shaders once in WGSL. Rive compiles them for Metal, Vulkan, Direct3D, WebGPU, and WebGL. It adds 25KB to the runtime.

Rive

85,381 subscribers

20,876 views • 4 days ago •via X (Twitter)

Anya Rossi• Live Now

Private livecam show

0 Comments

No comments available

Comments from the original post will appear here

Related Videos

🧊 Technical Showcase: A full WebGPU 3D engine that maps shader geometry to your DOM elements. Martin's gpu-curtains gives you lights, shadows, compute shaders, glTF, and instancing, but the real trick is how it turns your divs into scrollable, resizable shader planes without any coordinate math. The successor to curtains.js, rebuilt from scratch. 🔗 #WebGPU #CreativeCoding #Shaders #WebDev #3D

🧊 Technical Showcase: A full WebGPU 3D engine that maps shader geometry to your DOM elements. Martin's gpu-curtains gives you lights, shadows, compute shaders, glTF, and instancing, but the real trick is how it turns your divs into scrollable, resizable shader planes without any coordinate math. The successor to curtains.js, rebuilt from scratch. 🔗 #WebGPU #CreativeCoding #Shaders #WebDev #3D

WebGL / WebGPU

10,971 views • 6 months ago

SwissGL Demo: Particle Lenia with alien SOUNDS! Audio is fully rendered on GPU with GLSL shaders and streamed to WebAudio thanks to the new async GPU->CPU read feature. LIVE DEMO: Press "toggleAudio" in settings for sound 4K YouTube version: Source code:

SwissGL Demo: Particle Lenia with alien SOUNDS! Audio is fully rendered on GPU with GLSL shaders and streamed to WebAudio thanks to the new async GPU->CPU read feature. LIVE DEMO: Press "toggleAudio" in settings for sound 4K YouTube version: Source code:

Alex Mordvintsev

34,580 views • 3 years ago

Tutorial: build your own 3D engine inside Rive. Not a graphics programmer? AI can write the scripts: model import, lighting, materials, camera controls. Early Access today and once it's in production it ships everywhere (native mobile, consoles, vehicles, and of course the web)

Tutorial: build your own 3D engine inside Rive. Not a graphics programmer? AI can write the scripts: model import, lighting, materials, camera controls. Early Access today and once it's in production it ships everywhere (native mobile, consoles, vehicles, and of course the web)

Rive

11,189 views • 1 month ago

wdym you can vibe code your own effects in Figma Weave with custom controls and all? → Gen effect node is now live in your canvas. Free for everyone for 2 weeks

wdym you can vibe code your own effects in Figma Weave with custom controls and all? → Gen effect node is now live in your canvas. Free for everyone for 2 weeks

Figma Weave

79,008 views • 1 month ago

Today I release new GPU Particle Volumes system and the GPU Snow Particle shaders for it! This snow shader can render hundreds of thousands of particles at the same time even on a weak GPU. It also supports VRC Light Volumes. Get it on my Booth or Patreon!

Today I release new GPU Particle Volumes system and the GPU Snow Particle shaders for it! This snow shader can render hundreds of thousands of particles at the same time even on a weak GPU. It also supports VRC Light Volumes. Get it on my Booth or Patreon!

RED_SIM

43,721 views • 9 months ago

A 3D lunar rover simulator built with zero external dependencies runs directly on the GPU in the browser. The project demonstrates lightweight, engine-free rendering: → Simulates vehicle suspension and low-gravity wheel traction on procedural terrain → Uses custom WebGL and GLSL shaders for real-time lighting and surface deformation → Runs natively in a single context without third-party 3D frameworks or build steps → Handles dynamic camera tracking and interactive controls with high frame rates

A 3D lunar rover simulator built with zero external dependencies runs directly on the GPU in the browser. The project demonstrates lightweight, engine-free rendering: → Simulates vehicle suspension and low-gravity wheel traction on procedural terrain → Uses custom WebGL and GLSL shaders for real-time lighting and surface deformation → Runs natively in a single context without third-party 3D frameworks or build steps → Handles dynamic camera tracking and interactive controls with high frame rates

0xMarioNawfal

71,914 views • 23 days ago

This is Scene Editor. Running on Flutter 3.47 stable. Flutter is excellent for building serious 3D desktop apps. Powered entirely by Flutter's built-in graphics stack, Flutter GPU and Impeller. No forks, no platform views, no external rendering contexts. Scene Editor is just a vanilla Flutter application. Build 3D apps for macOS, Linux, Windows, iOS, Android, Web, and custom embedders. Non-destructive importing, overrides on nested prefabs, live material and shader editing, custom gizmos, and component inspectors you define with property annotations. It watches the filesystem, and custom components you write become instantly available in the editor upon saving. Configure, build, and run your live app without leaving it. Flutter is now 3D.

This is Scene Editor. Running on Flutter 3.47 stable. Flutter is excellent for building serious 3D desktop apps. Powered entirely by Flutter's built-in graphics stack, Flutter GPU and Impeller. No forks, no platform views, no external rendering contexts. Scene Editor is just a vanilla Flutter application. Build 3D apps for macOS, Linux, Windows, iOS, Android, Web, and custom embedders. Non-destructive importing, overrides on nested prefabs, live material and shader editing, custom gizmos, and component inspectors you define with property annotations. It watches the filesystem, and custom components you write become instantly available in the editor upon saving. Configure, build, and run your live app without leaving it. Flutter is now 3D.

Brandon DeRosier

11,876 views • 24 days ago

This is and example of a 3D map working in the GPU Canvas in Rive. The mesh uses an artboard as a texture with the map and zone interactions. The labels and icons are projected over the map.

This is and example of a 3D map working in the GPU Canvas in Rive. The mesh uses an artboard as a texture with the map and zone interactions. The labels and icons are projected over the map.

JcToon

10,230 views • 3 months ago

I’ve opened up many of the TSL exercises to everyone! Try out some WebGPU shaders and fiddle with them, all in the browser. Pick an exercise and see if you can match the output. Link: #threejs #webgpu

I’ve opened up many of the TSL exercises to everyone! Try out some WebGPU shaders and fiddle with them, all in the browser. Pick an exercise and see if you can match the output. Link: #threejs #webgpu

Simon

11,095 views • 10 months ago

Building Three.js shaders is about to get a whole lot easier! 👍 Introducing Three.js Shader Graph — visual node-based editing for TSL. 🖱️Drag & drop nodes 📺Real-time 3D preview 🔄Auto-generate TSL code in realtime Join the waitlist 👉🏻 #threejs #webgl #webgpu #shaders

Building Three.js shaders is about to get a whole lot easier! 👍 Introducing Three.js Shader Graph — visual node-based editing for TSL. 🖱️Drag & drop nodes 📺Real-time 3D preview 🔄Auto-generate TSL code in realtime Join the waitlist 👉🏻 #threejs #webgl #webgpu #shaders

Dan Greenheck

35,464 views • 8 months ago

Been pushing Rive's new 3D and shader support to see what's possible 🚀 Using AI + scripting, I was able to: • Import 3D models • Generate cameras and lights • Create custom shaders (wireframe, AO, sketch, toon) • Build materials • Project animated textures onto 3D geometry • Place 2D components directly in 3D space It's pretty wild to see how quickly Rive is evolving into a true all-in-one platform for interactive design.

Been pushing Rive's new 3D and shader support to see what's possible 🚀 Using AI + scripting, I was able to: • Import 3D models • Generate cameras and lights • Create custom shaders (wireframe, AO, sketch, toon) • Build materials • Project animated textures onto 3D geometry • Place 2D components directly in 3D space It's pretty wild to see how quickly Rive is evolving into a true all-in-one platform for interactive design.

Sanu Sagar

18,218 views • 3 months ago

💧 Technical Showcase: A piece of WebGL history, rebuilt for WebGPU. Evan Wallace's 2011 water demo helped convince Dylan Field (Dylan Field) that Figma could exist. Yong Su (jeantimex) ported it to WebGPU with full caustics, raytraced reflections, and the GitHub repo to study. 🔗 #WebGPU #WebGL #GraphicsProgramming #Shaders #Figma

💧 Technical Showcase: A piece of WebGL history, rebuilt for WebGPU. Evan Wallace's 2011 water demo helped convince Dylan Field (Dylan Field) that Figma could exist. Yong Su (jeantimex) ported it to WebGPU with full caustics, raytraced reflections, and the GitHub repo to study. 🔗 #WebGPU #WebGL #GraphicsProgramming #Shaders #Figma

WebGL / WebGPU

18,778 views • 7 months ago

Available for work ;) New quarter is about to start and I‘m again looking for commissions and digital artworks with shaders, 3D graphics in WebGL, ml, or generative art. Also, still interested in part-time creative or front-end development freelance projects like in the past. 🧵

Available for work ;) New quarter is about to start and I‘m again looking for commissions and digital artworks with shaders, 3D graphics in WebGL, ml, or generative art. Also, still interested in part-time creative or front-end development freelance projects like in the past. 🧵

ilithya

10,351 views • 2 years ago

We’re thrilled to announce that Gata Decentralized GPU Cloud is now LIVE! Start today → Built to accelerate the decentralization of the open AI economy, Gata enables anyone, anywhere to access decentralized GPU infrastructure, to build, train, and deploy AI models with full transparency and efficiency. GPU credits are now available for purchase directly with $GATA, creating a seamless bridge between compute and the decentralized economy.

We’re thrilled to announce that Gata Decentralized GPU Cloud is now LIVE! Start today → Built to accelerate the decentralization of the open AI economy, Gata enables anyone, anywhere to access decentralized GPU infrastructure, to build, train, and deploy AI models with full transparency and efficiency. GPU credits are now available for purchase directly with $GATA, creating a seamless bridge between compute and the decentralized economy.

Gata

49,241 views • 10 months ago

Created a cool demo for anyone to create shaders 😀You can write your code and see it live on the Las Vegas Sphere! Three.js

Created a cool demo for anyone to create shaders 😀You can write your code and see it live on the Las Vegas Sphere! Three.js

Alexandre Devaux

426,185 views • 2 years ago

I can finally announce the project I've been working on with Joce ! Fondant is building a new app that brings avatars and vtubing to Web. Multiplayer lobbies for vtuber streamer collabs or just hangouts with friends, as well as character customization tools building up to a full creator. We are using a WebGL and WebGPU techstack, so part of the point is to provide a cross-platform alternative to the current Unity based app ecosystem, and also to build tools that people can use to create or modify characters without going through a DCC (Blender, Maya, etc). For now we're starting with the basics: multiplayer lobbies, VRM support, and some tools like merging accessories into existing VRMs in the quoted post, and transferring Custom Vertex Normals from proxy meshes. My role is stylized shaders and procedural character creation. I've been working on NPR Shaders and tools to help build and customize 3D anime characters in Blender for years. With WebGPU, we can bring it into Web. My hope is to build a full character customization system for the Web with next gen toon shaders, and also a matching set of tools in Blender for serious content creators. But it is early days still, and there's a lot to be done! Here's the latest WIP of the rig for fitting proxy meshes to new faces.

I can finally announce the project I've been working on with Joce ! Fondant is building a new app that brings avatars and vtubing to Web. Multiplayer lobbies for vtuber streamer collabs or just hangouts with friends, as well as character customization tools building up to a full creator. We are using a WebGL and WebGPU techstack, so part of the point is to provide a cross-platform alternative to the current Unity based app ecosystem, and also to build tools that people can use to create or modify characters without going through a DCC (Blender, Maya, etc). For now we're starting with the basics: multiplayer lobbies, VRM support, and some tools like merging accessories into existing VRMs in the quoted post, and transferring Custom Vertex Normals from proxy meshes. My role is stylized shaders and procedural character creation. I've been working on NPR Shaders and tools to help build and customize 3D anime characters in Blender for years. With WebGPU, we can bring it into Web. My hope is to build a full character customization system for the Web with next gen toon shaders, and also a matching set of tools in Blender for serious content creators. But it is early days still, and there's a lot to be done! Here's the latest WIP of the rig for fitting proxy meshes to new faces.

aVersionOfReality

65,803 views • 1 year ago

I’ve been craving a video editor with motion baked in, designed to work with my own AI agents. Claude, Codex, whatever I want to use. I don’t want to be blocked by someone else’s credit system for every little interaction. I also wanted a Figma-like canvas/editor for when I want to jump in and tweak any little detail. So we built it: Video & audio editing: cut, zoom, speed up, add B-roll. Motion, animation, 3D, custom shaders & effects, custom 3D models, dynamic components & templates, audio and beat matching. And it’s all programmable. Design your own assets directly on the canvas, bring them in from Figma or the web, or just let the agent find them, mock them up, or record what it needs automatically. You can even drop in your screen recordings and just let loose. Supercut users: yes, it’ll have first-class support for your recordings, but it’ll work with anything. I’m going to be dropping a lot more examples and tutorials, so follow along. DM me for early access if you’re willing to give feedback. We’ll open it up to everyone very soon.

I’ve been craving a video editor with motion baked in, designed to work with my own AI agents. Claude, Codex, whatever I want to use. I don’t want to be blocked by someone else’s credit system for every little interaction. I also wanted a Figma-like canvas/editor for when I want to jump in and tweak any little detail. So we built it: Video & audio editing: cut, zoom, speed up, add B-roll. Motion, animation, 3D, custom shaders & effects, custom 3D models, dynamic components & templates, audio and beat matching. And it’s all programmable. Design your own assets directly on the canvas, bring them in from Figma or the web, or just let the agent find them, mock them up, or record what it needs automatically. You can even drop in your screen recordings and just let loose. Supercut users: yes, it’ll have first-class support for your recordings, but it’ll work with anything. I’m going to be dropping a lot more examples and tutorials, so follow along. DM me for early access if you’re willing to give feedback. We’ll open it up to everyone very soon.

Neil

23,042 views • 28 days ago

It’s time for photorealistic 3D to be everywhere on the web! Announcing our Three.js & React-Three-Fiber library for #GaussianSplatting! Capture from your phone, integrate anywhere, customize to match your brand, and build shaders/effects. Available now 👉 #3DGS #3D #threejs #LumaAI

Luma

230,503 views • 2 years ago