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.

Draw GLSL flowers with your cursor! 🌺 One full-screen plane, two render targets, and a bit of shader magic Live demo & source code: Made with Three.js Hosted on CodePen.IO Special thanks to The Book of Shaders #webgl #glsl #threejs #shader #drawingtool

Ksenia Kondrashova

8,754 subscribers

28,620 views • 3 years ago •via X (Twitter)

#webgl #glsl #threejs #shader #drawingtool

Anya Rossi• Live Now

Private livecam show

0 Comments

No comments available

Comments from the original post will appear here

Related Videos

If I had to choose one thing to do, it would be just coding WebGL flowers It's a GLSL shader, a full-screen plane, and 2 render targets to swap on each frame Live demo & source code: Made with Three.js Hosted on CodePen.IO Special thanks to The Book of Shaders

If I had to choose one thing to do, it would be just coding WebGL flowers It's a GLSL shader, a full-screen plane, and 2 render targets to swap on each frame Live demo & source code: Made with Three.js Hosted on CodePen.IO Special thanks to The Book of Shaders

Ksenia Kondrashova

51,837 views • 3 years ago

$GLSL fire shader based on Simplex noise with a static SVG overlay. No interactivity this time, just sketching on Saturday night ¯\_(ツ)_/¯ Live demo & source code: Made with Three.js Hosted on CodePen.IO$

GLSL fire shader based on Simplex noise with a static SVG overlay. No interactivity this time, just sketching on Saturday night ¯\_(ツ)_/¯ Live demo & source code: Made with Three.js Hosted on CodePen.IO

Ksenia Kondrashova

16,008 views • 3 years ago

I wanted to create a broken glass effect with WebGL for a long time! Here it is: interactive, lightweight (around 10KB of GLSL + vanilla JS), and easy to customise (find more controls on codepen) Live demo & source code: Hosted on CodePen.IO

I wanted to create a broken glass effect with WebGL for a long time! Here it is: interactive, lightweight (around 10KB of GLSL + vanilla JS), and easy to customise (find more controls on codepen) Live demo & source code: Hosted on CodePen.IO

Ksenia Kondrashova

43,624 views • 1 year ago

This glass configurator has no custom shaders or geometries. Just MeshPhysicalMaterial and a bunch of standard geometries with rendering order set manually. Not 100% realistic but super simple Live demo & source code: Made with Three.js Hosted on CodePen.IO

This glass configurator has no custom shaders or geometries. Just MeshPhysicalMaterial and a bunch of standard geometries with rendering order set manually. Not 100% realistic but super simple Live demo & source code: Made with Three.js Hosted on CodePen.IO

Ksenia Kondrashova

59,734 views • 3 years ago

It's October, my dudes! I've redone one of my fav old works. The updates: - transparent background - no extra libs so just <15kb of code - parameters that are easy to change without going through the shader Live demo & source code: Hosted on CodePen.IO

It's October, my dudes! I've redone one of my fav old works. The updates: - transparent background - no extra libs so just <15kb of code - parameters that are easy to change without going through the shader Live demo & source code: Hosted on CodePen.IO

Ksenia Kondrashova

99,480 views • 2 years ago

Bitspace now supports GLSL shaders. Write a fragment shader - and your uniforms automatically creates inputs on the Shader node. These inputs can be used to pipe colors, vectors or whatever from the rest of your Bitspace environment. new fragment

Bitspace now supports GLSL shaders. Write a fragment shader - and your uniforms automatically creates inputs on the Shader node. These inputs can be used to pipe colors, vectors or whatever from the rest of your Bitspace environment. new fragment

emil

32,949 views • 1 year ago

Rube Goldberg HTML form! Tbh I spent way too much time on this one haha. As fun as it is useless :) Live demo & source code: Hosted on CodePen.IO Made with #GSAP GSAP

Rube Goldberg HTML form! Tbh I spent way too much time on this one haha. As fun as it is useless :) Live demo & source code: Hosted on CodePen.IO Made with #GSAP GSAP

Ksenia Kondrashova

65,318 views • 2 years ago

New favorite noise function! I had lots of fun tweaking the yonatan shader and ended up using it as a semi-transparent overlay With color changing on scroll and slight cursor response, the total code size is still <9 kb 🫣 Live demo & source code: Original algorithm:

New favorite noise function! I had lots of fun tweaking the yonatan shader and ended up using it as a semi-transparent overlay With color changing on scroll and slight cursor response, the total code size is still <9 kb 🫣 Live demo & source code: Original algorithm:

Ksenia Kondrashova

20,374 views • 2 years ago

Imagine: Parallel Neural Networks with Shaders 🤔 (GLSL instead of CUDA) Parallelization by encoding the weights and activations as Buffer Objects or Textures, using fs to perform matmul and activation functions in parallel. Each fragm shader instance parproc 1..n neuron.

Imagine: Parallel Neural Networks with Shaders 🤔 (GLSL instead of CUDA) Parallelization by encoding the weights and activations as Buffer Objects or Textures, using fs to perform matmul and activation functions in parallel. Each fragm shader instance parproc 1..n neuron.

wavefnx

86,634 views • 1 year ago

I planned on releasing my Three.js WebGPU water shader 2 weeks ago, but I promised myself I would stop half-assing things this year. I'm glad I waited. I'll be selling the whole package for $99. Full demo video coming soon, but includes FFT water sim, underwater effects, dynamic sky + fog, buoyancy, and more. Every aspect is tunable. Comes with 8 presets and 4 quality levels so it will run on any device. You'll get full source code + demo code, plus all future updates and fixes. Join waitlist now and get an email for 20% off at launch #threejs #webgpu #shaders

I planned on releasing my Three.js WebGPU water shader 2 weeks ago, but I promised myself I would stop half-assing things this year. I'm glad I waited. I'll be selling the whole package for $99. Full demo video coming soon, but includes FFT water sim, underwater effects, dynamic sky + fog, buoyancy, and more. Every aspect is tunable. Comes with 8 presets and 4 quality levels so it will run on any device. You'll get full source code + demo code, plus all future updates and fixes. Join waitlist now and get an email for 20% off at launch #threejs #webgpu #shaders

Dan Greenheck

50,738 views • 6 months ago

TypeGPU 💜 Three.js TypeGPU 0.9 can integrate with Three.js Shading Language (TSL) on a very granular level, thanks to the @typegpu/three package. So now, you can write shaders in TypeScript while leveraging the rich Three.js ecosystem! To showcase the integration, we prepared docs and ported a handful of official Three.js examples 👇

TypeGPU 💜 Three.js TypeGPU 0.9 can integrate with Three.js Shading Language (TSL) on a very granular level, thanks to the @typegpu/three package. So now, you can write shaders in TypeScript while leveraging the rich Three.js ecosystem! To showcase the integration, we prepared docs and ported a handful of official Three.js examples 👇

Software Mansion

42,851 views • 6 months ago

Big thanks to everybody who encouraged me on this whacky gamedev journey! Today I replaced the complex cloud system with a simple shader and tuned some of the sound effects #gamedev #indiedev #devlog

Big thanks to everybody who encouraged me on this whacky gamedev journey! Today I replaced the complex cloud system with a simple shader and tuned some of the sound effects #gamedev #indiedev #devlog

Matt - Tiny Kingdoms

16,719 views • 5 months ago

With the release of Fable 5, I thought it would be fun to build and open-source a new MacOS screensaver using a metal shader, that way could also try building your own! Totally free, link to the repo below

With the release of Fable 5, I thought it would be fun to build and open-source a new MacOS screensaver using a metal shader, that way could also try building your own! Totally free, link to the repo below

Daniel Destefanis

54,180 views • 18 days ago

Six years later this is still one of my favorite outline effects especially for hard surface models like CAD & architecture. And now it works with three.js' WebGPURenderer thanks to a contribution from "cmhhelgeson" on Github!

Six years later this is still one of my favorite outline effects especially for hard surface models like CAD & architecture. And now it works with three.js' WebGPURenderer thanks to a contribution from "cmhhelgeson" on Github!

Garrett Johnson

23,120 views • 1 month ago

Tonight, tune in to a special US election episode of #NeverMindTheBallots, in association with Betfair Exchange hosted by Harry Cole. Catch the full show on and on our YouTube channel.

Tonight, tune in to a special US election episode of #NeverMindTheBallots, in association with Betfair Exchange hosted by Harry Cole. Catch the full show on and on our YouTube channel.

The Sun

11,875 views • 1 year ago

#WATCH | Uttarakhand: With just two days left for the opening of the portals of Lord Kedarnath, preparations are in full swing, and the temple decoration work has begun. The shrine of Baba Kedarnath is being adorned with several quintals of flowers. To give Kedarnath Temple a grand and divine appearance this year, around 51 quintals of flowers are being used for decoration. The temple premises is being adorned with vibrant, multi-colored flowers and special arrangements, creating a spiritually mesmerising experience for devotees.

#WATCH | Uttarakhand: With just two days left for the opening of the portals of Lord Kedarnath, preparations are in full swing, and the temple decoration work has begun. The shrine of Baba Kedarnath is being adorned with several quintals of flowers. To give Kedarnath Temple a grand and divine appearance this year, around 51 quintals of flowers are being used for decoration. The temple premises is being adorned with vibrant, multi-colored flowers and special arrangements, creating a spiritually mesmerising experience for devotees.

ANI

18,978 views • 3 months ago

With Uber Bubbles, we’re putting the heart of France’s champagne region at your fingertips. Book a full day trip to Reims & Épernay, inclusive of two tastings and lunch, with the added comfort of a safe, private, premium Uber vehicle. Link in Bio for more. See app for details.

With Uber Bubbles, we’re putting the heart of France’s champagne region at your fingertips. Book a full day trip to Reims & Épernay, inclusive of two tastings and lunch, with the added comfort of a safe, private, premium Uber vehicle. Link in Bio for more. See app for details.

Uber

298,363 views • 2 years ago

I'm so back 😍. Twitter is finally working again in my country. Thank you so much to all of you who supported my work during this time. A special thanks to Bruno Simon, who shared most of my recent work while I was away. God bless you, Bruno🙏🏻 I will celebrate the way I like most: sharing knowledge😊. You can find a new tutorial on my YouTube channel teaching you how to use Google incredible 👩‍🚀 ＜model-viewer＞, another taste of our loved #threejs to speed up your 3D web design. Hope you like it. #threejsJourney #glsl #creativecoding

I'm so back 😍. Twitter is finally working again in my country. Thank you so much to all of you who supported my work during this time. A special thanks to Bruno Simon, who shared most of my recent work while I was away. God bless you, Bruno🙏🏻 I will celebrate the way I like most: sharing knowledge😊. You can find a new tutorial on my YouTube channel teaching you how to use Google incredible 👩‍🚀 ＜model-viewer＞, another taste of our loved #threejs to speed up your 3D web design. Hope you like it. #threejsJourney #glsl #creativecoding

Anderson Mancini

27,486 views • 1 year ago

(1/n) 🚀 With FastVideo, you can now generate a 5-second video in 5 seconds on a single H200 GPU! Introducing FastWan series, a family of fast video generation models trained via a new recipe we term as “sparse distillation”, to speed up video denoising time by 70X! 🖥️ Live demo: (Thanks to @gmicloud for the support!) 🔗 Blog: 🔓 We fully open-source our models, code, and data with Apache-2.0 licenses

(1/n) 🚀 With FastVideo, you can now generate a 5-second video in 5 seconds on a single H200 GPU! Introducing FastWan series, a family of fast video generation models trained via a new recipe we term as “sparse distillation”, to speed up video denoising time by 70X! 🖥️ Live demo: (Thanks to @gmicloud for the support!) 🔗 Blog: 🔓 We fully open-source our models, code, and data with Apache-2.0 licenses

Hao AI Lab

78,660 views • 11 months ago

We are live now on Spaces with GMRX 🎙 Sponsored by GAIMIN, 10 lucky listeners will win a part of $50! Tune in, catch the secret code, and submit it here to enter the draw 👇 🔗

We are live now on Spaces with GMRX 🎙 Sponsored by GAIMIN, 10 lucky listeners will win a part of $50! Tune in, catch the secret code, and submit it here to enter the draw 👇 🔗

Gacha Galaxy 🟣 | Price Oracle for Collectibles

19,612 views • 1 year ago