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.

Introducing OpenShaders. I’m building the home shaders deserve. Discover, build, publish, and install shaders made to ship. Open source. WebGL/WebGPU. One click away. Claim your username and reveal your unique shader. 🧵

David Haz

12,937 subscribers

48,225 views • 2 months ago •via X (Twitter)

Science & Technology

Anya Rossi• Live Now

Private livecam show

58 Comments

David Haz2 months ago

An honor to have you! 🙏

David Haz2 months ago

The name you claim today will be your handle when the full platform opens. Your handle generates a one-of-one shader, with its own colors, effects, and rarity. Here are a few examples. Show me what your name creates.

David Haz2 months ago

OpenShaders will bring discovery, a live shader editor and publishing together. Find shaders you love, learn how they work, build your own, and share them. Then take them into real websites. Already in development. Free and open source.

(dm)ytro kondakov2 months ago

This might be the first time I claimed my first name in any product ever

David Haz2 months ago

I hope it was worth it, and will continue to he 🙏🥹

David Haz2 months ago

To be*

gokhan2 months ago

I'm gonna use this as a personal background in my screenshot tool

David Haz2 months ago

Looks nice 🫡👀

François Best2 months ago

It’s got MacOS X Snow Leopard vibes, I like it!

David Haz2 months ago

It’s beautiful 🥹

François Best2 months ago

Man I miss that era..

David Haz2 months ago

Ooooh, this brings me back

Edoardo Lunardi2 months ago

No way this is so accurate 🔥

David Haz2 months ago

There's beauty in randomness 🙇‍♂️

grim2 months ago

not too shabby 🔥

David Haz2 months ago

Halftone is good! 🔥

Mayte CG2 months ago

Here's mine 😁 Love the CRT vibes!

Jay Vegad ⓧ2 months ago

I'm in 🎉

Dunsin🎙️2 months ago

Ohhhhhh coool

David Haz2 months ago

I hope you got one you like! 👀

Dunsin🎙️2 months ago

It was okay.... Joking, I did like it, love the color too😂

David Haz2 months ago

Yeah I know you vibe with blue! 👀

Dunsin🎙️2 months ago

Blue is my colour 💙😍

grim2 months ago

YOU COOKED

David Haz2 months ago

THANK YOU

David Haz2 months ago

sick! Welcome aboard!

David Haz2 months ago

clean!

gsimone2 months ago

I'm in 🕶️

David Haz2 months ago

Legend!

Travis Fischer2 months ago

just snagged 'travis' :) hmmm the export video should use the light mode like i had in the webapp really sexy lil site!

David Haz2 months ago

Woah, I think you got the 1% rarity!

Abhinav2 months ago

lfg ❤️

Stas Kulesh2 months ago

Loving the scale and ambition

David Haz2 months ago

Will do my absolute best. Thank you!

jonas2 months ago

claimed and shared !

David Haz2 months ago

Welcome!

Hoang Nguyen2 months ago

Got mine

David Haz2 months ago

very nice! welcome aboard!

Chase Davis2 months ago

Bravo. Please don’t give Chase bank my handle when they ask it for it some day. I am sure this will be a beautifully executed platform based on react bits and can’t wait to try it out. It’s similar in spirit to something I’ve been toying with for years so I know how hard this is! OSS is a great call to get the community involved

David Haz2 months ago

I promise it will remain yours haha!

Chase Davis2 months ago

Or my number…

FromNow2 months ago

Just claim @ lawson

David Haz2 months ago

I saw it! Welcome aboard!

lisham2 months ago

video launch skills very high quality

Shubhu2 months ago

i'm all in, but no underscore in usernames?

David Haz2 months ago

I'll update and allow underscores for those who need it

Shubhu2 months ago

can i change mine to positronx_👀

Chris 🧱2 months ago

Looks so damn awesome

David Haz2 months ago

Thanks man!

Felipe Castor2 months ago

Cool

Filip ↟2 months ago

Cool 🔥 Can't wait to see what you built David.

David Haz2 months ago

So good!

Sammie 🔥 👩‍💻2 months ago

Amazing 🙌🏻🔥🔥

David Haz2 months ago

Wooo!

Harsh2 months ago

Lesgoo , Congratulations for the launch !

David Haz2 months ago

The actual launch is soon! This is just a small gift and heads up! Your shader looks very nice too!

Grenish Rai2 months ago

I like where this is going.

David Haz2 months ago

To the moon!

Related Videos

After spending some time in the Virgin Islands, I was inspired to create a WebGPU-based water shader with TSL and compute shaders 🌊 Lots left to do, but it's finally starting to look decent! #threejs #webgl #webgpu #shaders

After spending some time in the Virgin Islands, I was inspired to create a WebGPU-based water shader with TSL and compute shaders 🌊 Lots left to do, but it's finally starting to look decent! #threejs #webgl #webgpu #shaders

Dan Greenheck

28,002 views • 11 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 • 11 months ago

WebGPU + Compute Shaders = 🤯 >500K stars runs at 60fps on my M1 Pro ⚡️ In my latest blog post, I walk through how to build this interactive galaxy simulation 🌌 Source code and live demo link in comments 👇🏻 #threejs #webgl #webgpu #shaders

WebGPU + Compute Shaders = 🤯 >500K stars runs at 60fps on my M1 Pro ⚡️ In my latest blog post, I walk through how to build this interactive galaxy simulation 🌌 Source code and live demo link in comments 👇🏻 #threejs #webgl #webgpu #shaders

Dan Greenheck

18,629 views • 11 months ago

Introducing Radiant: 80+ production-ready shaders and visual effects for the web. 0 dependencies, MIT license. - multiple color themes - ultra-realistic simulations - webgl and 2d canvas Pick one, copy source, integrate, ship.

Introducing Radiant: 80+ production-ready shaders and visual effects for the web. 0 dependencies, MIT license. - multiple color themes - ultra-realistic simulations - webgl and 2d canvas Pick one, copy source, integrate, ship.

Paul Bakaus

145,783 views • 7 months ago

Meet the new Shaders connector Hundreds of animated, WebGPU-powered presets from shaders now one prompt away inside any Bolt project. The easiest way to give your build the kind of visual polish that used to take custom work.

Meet the new Shaders connector Hundreds of animated, WebGPU-powered presets from shaders now one prompt away inside any Bolt project. The easiest way to give your build the kind of visual polish that used to take custom work.

bolt.new

10,307 views • 6 months ago

🧊 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

11,222 views • 8 months ago

Introducing Orbkit 🔮 A collection of 30+ free and open-source WebGL shader orbs for AI and voice agent states, built with React, TypeScript, and shadcn. Each orb reacts to idle, thinking, and speaking out of the box. Install one, copy the code, and make it yours. Thanks Xor ! Most of these shaders were referenced from the work he posts here. Go check out his account, it's a goldmine of shader art. Link: 👇🏼

Introducing Orbkit 🔮 A collection of 30+ free and open-source WebGL shader orbs for AI and voice agent states, built with React, TypeScript, and shadcn. Each orb reacts to idle, thinking, and speaking out of the box. Install one, copy the code, and make it yours. Thanks Xor ! Most of these shaders were referenced from the work he posts here. Go check out his account, it's a goldmine of shader art. Link: 👇🏼

shawn.

39,470 views • 2 months ago

Introducing Anatomy Describe a machine in one line. Claude brings it to life. - Interactive isometric wireframes you can rotate, inspect and explore - WebGL shaders for fire, water, plasma and more - Real 3D motion, with individual parts that rotate and move Install it as an agent skill. Fully open source.

Introducing Anatomy Describe a machine in one line. Claude brings it to life. - Interactive isometric wireframes you can rotate, inspect and explore - WebGL shaders for fire, water, plasma and more - Real 3D motion, with individual parts that rotate and move Install it as an agent skill. Fully open source.

R

2,687,330 views • 1 month ago

Excited to announce that Three.js Water Pro 🌊 is now available for purchase! Can't wait to see what people build with this. Welcome to the era of WebGPU! 🚀 #threejs #webgpu #webgl #shaders

Excited to announce that Three.js Water Pro 🌊 is now available for purchase! Can't wait to see what people build with this. Welcome to the era of WebGPU! 🚀 #threejs #webgpu #webgl #shaders

Dan Greenheck

37,900 views • 9 months ago

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.

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

30,777 views • 2 months ago

First test with #webgpu #threejs #tsl : InstancedMesh, node material, compute shaders and psrdnoise. Demo : Source :

First test with #webgpu #threejs #tsl : InstancedMesh, node material, compute shaders and psrdnoise. Demo : Source :

Kevin Levron

19,507 views • 2 years ago

Introducing Shaders v3 🔥 Our biggest release yet. Built for design engineers who ship magic. Design production-ready WebGPU shader effects on an infinite canvas, powered by a new rendering engine that's up to 25× faster.

Introducing Shaders v3 🔥 Our biggest release yet. Built for design engineers who ship magic. Design production-ready WebGPU shader effects on an infinite canvas, powered by a new rendering engine that's up to 25× faster.

shaders

69,911 views • 3 months ago

We built to ship shaders on Now it's open source. ▪︎ Minimal agent-first WebGPU library ▪︎ Run in the browser or headless Node.js ▪︎ Render in CPU sandboxes and CI tests ▪︎ Create reusable .wgsl modules

We built to ship shaders on Now it's open source. ▪︎ Minimal agent-first WebGPU library ▪︎ Run in the browser or headless Node.js ▪︎ Render in CPU sandboxes and CI tests ▪︎ Create reusable .wgsl modules

Vercel

928,740 views • 2 months ago

$I am having a lot of fun with this ThreeJS game. Will probably be spending more time on this cosy flyer game for #vibejam And btw, shaders are awesome! I highly recommend anyone building a 3D game to add some shaders to make your game look good. Here's a quick primer on the different types of shaders you can tell your AI to level up your game's graphics: - Noise-based shader for water refractions or shimmer - Fresnel shader for a nice rim lighting effect on your 3D game objects - Post-processing shader to change your game's color scheme dynamically - Post-processing shaders like the VHS effect that @levelsio use for the Drone flyer game - Shader effect to make the trees sway or objects wobble - and many more uses Shaders are incredibly versatile and useful. I would recommend you to go YT to check out some shader basics videos and come up with more creative uses for them!$

I am having a lot of fun with this ThreeJS game. Will probably be spending more time on this cosy flyer game for #vibejam And btw, shaders are awesome! I highly recommend anyone building a 3D game to add some shaders to make your game look good. Here's a quick primer on the different types of shaders you can tell your AI to level up your game's graphics: - Noise-based shader for water refractions or shimmer - Fresnel shader for a nice rim lighting effect on your 3D game objects - Post-processing shader to change your game's color scheme dynamically - Post-processing shaders like the VHS effect that @levelsio use for the Drone flyer game - Shader effect to make the trees sway or objects wobble - and many more uses Shaders are incredibly versatile and useful. I would recommend you to go YT to check out some shader basics videos and come up with more creative uses for them!

Danny Limanseta

203,685 views • 7 months ago

Introducing Canvas UI, the first ever html-in-canvas component library. Your DOM is the render target now. Real-time shaders over real, interactive UI. 24 components. React, Vue, Svelte, vanilla TS. Free. Open source. 🧵

Introducing Canvas UI, the first ever html-in-canvas component library. Your DOM is the render target now. Real-time shaders over real, interactive UI. 24 components. React, Vue, Svelte, vanilla TS. Free. Open source. 🧵

David Haz

1,429,190 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 • 9 months ago

Made some major improvements to my WebGPU water shader (thanks Ghislain Girardot for the feedback!) Fixed a bug where waves weren't propagating and implemented JONSWAP spectrum for more realistic wave grouping. Hitting ~70FPS @ 2K res on my Macbook M1 Pro #threejs #webgpu #shaders

Made some major improvements to my WebGPU water shader (thanks Ghislain Girardot for the feedback!) Fixed a bug where waves weren't propagating and implemented JONSWAP spectrum for more realistic wave grouping. Hitting ~70FPS @ 2K res on my Macbook M1 Pro #threejs #webgpu #shaders

Dan Greenheck

18,852 views • 11 months ago

Introducing Rewamp UI My first open-source UI library. 70+ ready-to-use components built for modern websites. From shaders and animations to navbars, buttons, cards, and more everything you need, all in one place. Completely free. Go check it out : Drop your honest reviews below.

Introducing Rewamp UI My first open-source UI library. 70+ ready-to-use components built for modern websites. From shaders and animations to navbars, buttons, cards, and more everything you need, all in one place. Completely free. Go check it out : Drop your honest reviews below.

Palak

143,447 views • 1 month ago

i made a 3D stained glass type design tool it renders live in the browser using threejs and webgl shaders

i made a 3D stained glass type design tool it renders live in the browser using threejs and webgl shaders

AA

47,343 views • 6 months ago