正在加载视频...

视频加载失败

返回首页

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

uuuuuulala's profile picture

Ksenia Kondrashova

8,755 subscribers

16,008 次观看 • 3 年前 •via X (Twitter)

LIVE

Anya Rossi• Live Now

Private livecam show

0 条评论

暂无评论

原始帖子的评论将显示在这里

相关视频

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
0:13

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

28,620 次观看 • 3 年前

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
0:15

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,886 次观看 • 3 年前

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
0:16

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,771 次观看 • 3 年前

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
0:19

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,417 次观看 • 2 年前

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
0:18

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,711 次观看 • 1 年前

Another minimal JS animation here! Interactive (and damn satisfying) cursor animation made with only 3kb of pure JS. Not sure how to use it yet – maybe as a base for some shader?.. Anyway, it's fun already :) Live demo & source code: Hosted on CodePen.IO
0:15

Another minimal JS animation here! Interactive (and damn satisfying) cursor animation made with only 3kb of pure JS. Not sure how to use it yet – maybe as a base for some shader?.. Anyway, it's fun already :) Live demo & source code: Hosted on CodePen.IO

Ksenia Kondrashova

52,889 次观看 • 3 年前

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
0:18

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,629 次观看 • 3 年前

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:
0:13

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 次观看 • 2 年前

A Three.js and GLSL mathematical lattice engine that morphs between four geometric topologies, with a glass dock for shape switching and a live telemetry overlay calculating phase coherence. Demo and code 👇
0:15

A Three.js and GLSL mathematical lattice engine that morphs between four geometric topologies, with a glass dock for shape switching and a live telemetry overlay calculating phase coherence. Demo and code 👇

Techartist

14,639 次观看 • 4 个月前

made this interactive pattern with GLSL code for a website I'm working on
0:14

made this interactive pattern with GLSL code for a website I'm working on

OneBit

219,076 次观看 • 1 年前

This isn’t a 3D model file. It’s 100% code Our world-famous Mars Cat avatar has been reconstructed entirely as Three.js source code No GLB at runtime. No model download. No textures or UV atlas. Just code, rendered directly in the browser It was created with IMG2THREEJS by Nick. An incredible open-source project with over 15,000 stars on GitHub And our Mars Cat is now featured on the home page gallery See it live below ↓. Grab the code. Add it to your game New to Three.js? It’s one of the most popular open-source JavaScript libraries for building interactive 3D experiences and games on the web
0:18

This isn’t a 3D model file. It’s 100% code Our world-famous Mars Cat avatar has been reconstructed entirely as Three.js source code No GLB at runtime. No model download. No textures or UV atlas. Just code, rendered directly in the browser It was created with IMG2THREEJS by Nick. An incredible open-source project with over 15,000 stars on GitHub And our Mars Cat is now featured on the home page gallery See it live below ↓. Grab the code. Add it to your game New to Three.js? It’s one of the most popular open-source JavaScript libraries for building interactive 3D experiences and games on the web

Jay B 😻🚀

15,044 次观看 • 1 个月前

Made a lil illustration in Figma draw with dynamic stroke and texture effects and text on a path. I dared to paste the SVG code into CodePen.IO ... this is what happened... Spoiler alert... It worked! ˗ˏˋ rogie ˎˊ˗ Lauren Budorick 𝕞𝕒𝕩𝕧𝕠𝕝𝕥𝕒𝕣 you super amazing brilliant beautiful people! This is delight!
0:15

Made a lil illustration in Figma draw with dynamic stroke and texture effects and text on a path. I dared to paste the SVG code into CodePen.IO ... this is what happened... Spoiler alert... It worked! ˗ˏˋ rogie ˎˊ˗ Lauren Budorick 𝕞𝕒𝕩𝕧𝕠𝕝𝕥𝕒𝕣 you super amazing brilliant beautiful people! This is delight!

miggi from figgi

20,960 次观看 • 1 年前

Jack Whitehall hosts Saturday Night Live UK this week, with music from Jorja Smith. Saturday 10pm on Sky
0:20

Jack Whitehall hosts Saturday Night Live UK this week, with music from Jorja Smith. Saturday 10pm on Sky

Sky TV

7,739,428 次观看 • 6 个月前

More than just a selfie with “EL IDOLO” ANDRADE this time! Watch #AEWDynamite LIVE on TBS &amp; HBO Max
0:11

More than just a selfie with “EL IDOLO” ANDRADE this time! Watch #AEWDynamite LIVE on TBS &amp; HBO Max

All Elite Wrestling

99,242 次观看 • 8 个月前

You don't need Claude Fable 5 or GPT-5.6 I built with Claude 👇 Drifting particles + pulsing sound rings, the techniques: 1. Flow field = each particle reads a Simplex noise field for which way to drift, organic not random. 2. GPGPU = thousands of particles updated on the GPU in a texture, 60fps on a phone. 3. Audio-reactive shader = the rings pulse to the track frequency data. 4. Selective bloom = only the bright parts glow. Lenis + GSAP + Three.js. Save this 🔊
0:16

You don't need Claude Fable 5 or GPT-5.6 I built with Claude 👇 Drifting particles + pulsing sound rings, the techniques: 1. Flow field = each particle reads a Simplex noise field for which way to drift, organic not random. 2. GPGPU = thousands of particles updated on the GPU in a texture, 60fps on a phone. 3. Audio-reactive shader = the rings pulse to the track frequency data. 4. Selective bloom = only the bright parts glow. Lenis + GSAP + Three.js. Save this 🔊

FHILY👑

462,463 次观看 • 3 个月前

A demo like this on with live mainnet transactions for fractions of a cent with sub second confirmation is literally ONLY POSSIBLE ON Solana Payments Others LARP @Solana just works in prod
0:13

A demo like this on with live mainnet transactions for fractions of a cent with sub second confirmation is literally ONLY POSSIBLE ON Solana Payments Others LARP @Solana just works in prod

hårkl

12,219 次观看 • 7 个月前

Real-time laser beam Niagara system with a fire &amp; smoke sim on top.
0:11

Real-time laser beam Niagara system with a fire &amp; smoke sim on top.

Jesse Pitela

137,716 次观看 • 2 个月前

Weeks of work for a senior Three.js dev is ONE prompt for Opus 5, literally 😅 Opus built this infinite physically simulated clothesline gallery using Three.js with 96 wave nodes, per card pendulum physics, custom rope shader with fibre noise and Fresnel rim. I don't even know half of those terms but it's what it is (I'm studying each code part, though). These days, you just describe what you want and get it done using AI. Any kind of effect almost. Live: Code: Design:
0:15

Weeks of work for a senior Three.js dev is ONE prompt for Opus 5, literally 😅 Opus built this infinite physically simulated clothesline gallery using Three.js with 96 wave nodes, per card pendulum physics, custom rope shader with fibre noise and Fresnel rim. I don't even know half of those terms but it's what it is (I'm studying each code part, though). These days, you just describe what you want and get it done using AI. Any kind of effect almost. Live: Code: Design:

The Bugged Dev

27,937 次观看 • 2 个月前

alrighty! marquee along path component is live on fancy! w/ a bunch of customizations: - scroll based velocity - draggable - slowdown on hover - custom easing - mapping any CSS prop from start to end - docs on how it's built! source code &amp; link in comments↴
0:15

alrighty! marquee along path component is live on fancy! w/ a bunch of customizations: - scroll based velocity - draggable - slowdown on hover - custom easing - mapping any CSS prop from start to end - docs on how it's built! source code &amp; link in comments↴

daniel petho

16,796 次观看 • 1 年前