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.

Three.js Water Pro officially supports using Three.js Sky Pro as a dynamic sky option! 🌊☀️☁️ Live Demo: This was actually way more complicated that I anticipated, but it's now robust enough I'm comfortable releasing it. More info in comments!👇🏻

Dan Greenheck

10,026 subscribers

25,471 views • 1 month ago •via X (Twitter)

Arts Science & Technology

Anya Rossi• Live Now

Private livecam show

30 Comments

Dan Greenheck1 month ago

For Water Pro + Sky Pro owners, you'll need to download the latest updates - Water Pro v3.2.0 - Sky Pro v2.0.0 I had to rewrite a massive part of the Sky Pro API, so be sure to check out the migration guide:

Dan Greenheck1 month ago

To get a jump start on integrating them into the same project, follow this guide:

Dan Greenheck1 month ago

Get Water Pro:

Dan Greenheck1 month ago

Get Sky Pro:

Aggroed Lighthacker- Peace, Prosperity, & Freedom1 month ago

bruh. That's the best water I've seen for threejs

jeantimex1 month ago

Does it support on mobile devices? My iPhone 15 seems can’t run it.

Dan Greenheck1 month ago

Looks like it’s rendering? I have an iPhone 15 and it works on latest Chrome and Safari. It does take a while to compile the shaders on first load.

jeantimex1 month ago

Oh it’s working now, great work!

Dan Greenheck1 month ago

As promised!

@Ralik1 month ago

wow, that's look insane🔥

briceiscoding1 month ago

Incredible!

Tushar1 month ago

So good 🤌

MightyLab1 month ago

@threejs 헐 대박 👍🏼👍🏼👍🏼👍🏼👍🏼👍🏼

Kevin Rajan1 month ago

@threejs

André1 month ago

This looks ridiculously sexy

AI and Robots1 month ago

Looks great Dan. Brilliant work.

Sam Bischof1 month ago

Gigabyte internet, 128gb ram, getting 1fps...what am I missing?

Maximus Bertius1 month ago

very pretty mate

yomments1 month ago

wow impressive

Ian Danforth1 month ago

Everything was working wonderfully until I slid the Pixel Ratio to 1.2 and then it crashed and even hard reload doesn't fix it - Firefox 152.0.6

Mark1 month ago

Oooooooooo! Very nice! 🍻

Hand Job Game Studios1 month ago

What you can do with Three.js is sick.

cryptomanavan ☀️1 month ago

Love your works dude. It’s insane level pro.

Mergestorm1 month ago

I remember you working on the cloud refraction, looks insane!

Static1 month ago

How do the clouds look up close or as the camera goes through them?

Peter Kogo1 month ago

There are some weird artifacts when using a pixel ratio other than 1.

Reece1 month ago

This is sick

Knights of Asthuria by Hollow Interactive1 month ago

Dude this is fucking cool!!!

Al Amin Rifat1 month ago

this is insanely good

MaxCG1 month ago

2-5 fps

Related Videos

Three.js Water Pro v2.1 is now live! 🌊 Some exciting updates in this version - Improved FPS by ~30% across all quality levels - Support for transparent objects - Tunable standing vs. traveling waves Going to take a bit of a break from this project now to focus on my WebGPU course and sky shader!

Three.js Water Pro v2.1 is now live! 🌊 Some exciting updates in this version - Improved FPS by ~30% across all quality levels - Support for transparent objects - Tunable standing vs. traveling waves Going to take a bit of a break from this project now to focus on my WebGPU course and sky shader!

Dan Greenheck

63,156 views • 5 months ago

It's amazing what proper lighting (and Skyrim music 😁) can do to a scene. I'm replacing the procedural sky in Three.js Water Pro v3 with HDRIs from Polyhaven (converted to UltraHDR jpeg, only 500KB instead of 20MB). I think the results speak for themselves.

It's amazing what proper lighting (and Skyrim music 😁) can do to a scene. I'm replacing the procedural sky in Three.js Water Pro v3 with HDRIs from Polyhaven (converted to UltraHDR jpeg, only 500KB instead of 20MB). I think the results speak for themselves.

Dan Greenheck

24,140 views • 3 months ago

Well it took an all nighter (isn't all the best coding done at 4AM?!), but Three.js Water Pro v2.0 has launched! 🚀 Super excited about this launch—I've added a new wave system, sky/water transitions, improved foam effects, reflections, and so much more. Here's a little cinematic trailer I put together (sound on🫧). Enjoy!

Well it took an all nighter (isn't all the best coding done at 4AM?!), but Three.js Water Pro v2.0 has launched! 🚀 Super excited about this launch—I've added a new wave system, sky/water transitions, improved foam effects, reflections, and so much more. Here's a little cinematic trailer I put together (sound on🫧). Enjoy!

Dan Greenheck

27,988 views • 6 months ago

I was checking how the site for the Apple Vision Pro was made. Can confirm that this section was made with Three.js. They're using a pretty clever technique that breaks the Vision Pro model in segments using GLTFs and it's reassembled on the browser. Pretty darn cool.

I was checking how the site for the Apple Vision Pro was made. Can confirm that this section was made with Three.js. They're using a pretty clever technique that breaks the Vision Pro model in segments using GLTFs and it's reassembled on the browser. Pretty darn cool.

Davo

232,447 views • 3 years ago

After 5 failed attempts and a week of long nights (thanks for nothing Claude), I finally have seamless air/water transitions in Three.js Water Pro. I was going to save this for V3 but the existing transition was so bad, I wanted to get it fixed and done right. If you want to get notified when Three.js Water Pro V2 gets released—plus weekly Three.js tips and tutorials—be sure to sign up for my newsletter. You'll also receive a code for 10% OFF you first order when you sign up!

After 5 failed attempts and a week of long nights (thanks for nothing Claude), I finally have seamless air/water transitions in Three.js Water Pro. I was going to save this for V3 but the existing transition was so bad, I wanted to get it fixed and done right. If you want to get notified when Three.js Water Pro V2 gets released—plus weekly Three.js tips and tutorials—be sure to sign up for my newsletter. You'll also receive a code for 10% OFF you first order when you sign up!

Dan Greenheck

207,004 views • 6 months ago

Three.js Water Pro is finally getting rivers (and lakes)! This has been on my wishlist for a LONG time and I'm super excited to finally have the time to work on it. Tons left to do, but static flow maps are now working and using the Water Pro core renderer. I'll be including browser-based editing tools, so you can mold and shape your rivers/lakes in real-time within your scene (or define them with code if you prefer). I'll also be adding dynamic shallow water simulation for applications that require dynamic interaction with obstacles and lots more! Link to waiting list below 👇🏻

Three.js Water Pro is finally getting rivers (and lakes)! This has been on my wishlist for a LONG time and I'm super excited to finally have the time to work on it. Tons left to do, but static flow maps are now working and using the Water Pro core renderer. I'll be including browser-based editing tools, so you can mold and shape your rivers/lakes in real-time within your scene (or define them with code if you prefer). I'll also be adding dynamic shallow water simulation for applications that require dynamic interaction with obstacles and lots more! Link to waiting list below 👇🏻

Dan Greenheck

14,522 views • 17 days ago

Okay this one’s been living in my head for a while… finally built it ❤️‍🔥 A fully vibe coded interactive planet explorer. No blender models, just pure geometry, pure math, using Three.js with frustum, culling Logic, raycasting, spring physics, and more. Built using Gemini 3.1 Pro in Google AI Studio as always :D Live:

Okay this one’s been living in my head for a while… finally built it ❤️‍🔥 A fully vibe coded interactive planet explorer. No blender models, just pure geometry, pure math, using Three.js with frustum, culling Logic, raycasting, spring physics, and more. Built using Gemini 3.1 Pro in Google AI Studio as always :D Live:

The Bugged Dev

47,744 views • 4 months ago

GLM-5.3 Flash in already nerfed? I compared Ox Alpha in it's prime vs today just before it got revealed as GLM-5.3 Flash using the same prompt to build 3d raptor engine using three.js OxAlpha on 24th August gave far more accurate output compared to today which looks way worse prompt i used: Create a 3d SpaceX raptor engine using three.js, use white theme background so the main object is clearly visible

GLM-5.3 Flash in already nerfed? I compared Ox Alpha in it's prime vs today just before it got revealed as GLM-5.3 Flash using the same prompt to build 3d raptor engine using three.js OxAlpha on 24th August gave far more accurate output compared to today which looks way worse prompt i used: Create a 3d SpaceX raptor engine using three.js, use white theme background so the main object is clearly visible

Tim Jayas

78,962 views • 18 days ago

img2threejs 1.5.1 is out 🚀 Checkout: This release introduces a new approach to image → 3D → Three.js. Image → Tripo → img2threejs → reconstructed geometry → Three.js Instead of using the generated 3D model as the final asset, img2threejs uses it as a reference to rebuild the character into a representation that can be generated and rendered directly in Three.js. No Blender workflow, and no GLB required as the final output. The animation in the demo is still a bit rough because this release is focused on reconstruction, not animation. I’ll be improving that in the next release. Still experimental, but this is a big step toward where I want img2threejs to go.

img2threejs 1.5.1 is out 🚀 Checkout: This release introduces a new approach to image → 3D → Three.js. Image → Tripo → img2threejs → reconstructed geometry → Three.js Instead of using the generated 3D model as the final asset, img2threejs uses it as a reference to rebuild the character into a representation that can be generated and rendered directly in Three.js. No Blender workflow, and no GLB required as the final output. The animation in the demo is still a bit rough because this release is focused on reconstruction, not animation. I’ll be improving that in the next release. Still experimental, but this is a big step toward where I want img2threejs to go.

Nick

117,272 views • 20 days ago

This is PURE MATH!! Built fully with Three.js and completely vibe coded using Gemini 3.1 Pro in Google AI Studio. This is what AI can do right now. I have been vibe coding a lot of websites lately and every day these models go beyond what I thought was possible 🤯 Still in awe. Expect more voxel 3D drops coming to my feed :) Remix:

This is PURE MATH!! Built fully with Three.js and completely vibe coded using Gemini 3.1 Pro in Google AI Studio. This is what AI can do right now. I have been vibe coding a lot of websites lately and every day these models go beyond what I thought was possible 🤯 Still in awe. Expect more voxel 3D drops coming to my feed :) Remix:

The Bugged Dev

30,073 views • 5 months ago

potter 🇺🇸 on her work as Evil Geniuses' coach during the 2026 season: "Figuring out how to get five players comfortable was a lot more challenging this year than I anticipated. It's definitely on me" "Right now, I'm just trying to think positively."

potter 🇺🇸 on her work as Evil Geniuses' coach during the 2026 season: "Figuring out how to get five players comfortable was a lot more challenging this year than I anticipated. It's definitely on me" "Right now, I'm just trying to think positively."

Sheep Esports VALORANT

236,571 views • 12 days ago

I haven't released a new course in two years because I thought AI would replace education. I was wrong. In a sea of AI slop, good education has never felt more relevant. So I'm releasing DesignCode 5 with a new Codex masterclass. The new site was built entirely in Codex with lots of three.js components: I added homework, tests, certificates, a vault, and weekly live sessions. Pro and Lifetime members also get the Product Pass, with one year of Pro access to Framer, Mobbin, Aura, and more. GPT-5.6 Sol xHigh migrated ten years of content from a large CMS and Dropbox into Firebase. That made me realize I didn't need to build another CMS. With the right skills, Codex can handle video editing, writing, image generation, screen recording, and content updates. I'm spending less time managing everything and more time creating. It's never been more fun. I created a bunch of skills for this workflow. They're all in my repo, and the Three.js components are on Huge thanks to Framer and Mobbin for believing in me and giving our Pro and Lifetime students one year of Pro access. To every new student, welcome. I'll be there every week, giving you direct feedback and teaching you everything I know. DesignCode 5 is 50% off for early adopters right now. There's also a $499 Lifetime option for anyone tired of another subscription.

I haven't released a new course in two years because I thought AI would replace education. I was wrong. In a sea of AI slop, good education has never felt more relevant. So I'm releasing DesignCode 5 with a new Codex masterclass. The new site was built entirely in Codex with lots of three.js components: I added homework, tests, certificates, a vault, and weekly live sessions. Pro and Lifetime members also get the Product Pass, with one year of Pro access to Framer, Mobbin, Aura, and more. GPT-5.6 Sol xHigh migrated ten years of content from a large CMS and Dropbox into Firebase. That made me realize I didn't need to build another CMS. With the right skills, Codex can handle video editing, writing, image generation, screen recording, and content updates. I'm spending less time managing everything and more time creating. It's never been more fun. I created a bunch of skills for this workflow. They're all in my repo, and the Three.js components are on Huge thanks to Framer and Mobbin for believing in me and giving our Pro and Lifetime students one year of Pro access. To every new student, welcome. I'll be there every week, giving you direct feedback and teaching you everything I know. DesignCode 5 is 50% off for early adopters right now. There's also a $499 Lifetime option for anyone tired of another subscription.

Meng To

115,272 views • 16 days ago

The pace at which Gemini 2.5 Pro is improving in code is wild! I generally leaned towards using Claude for code, but now I rely more on Gemini 2.5 Pro. It's just that good! Watch me use Gemini-2.5-Pro-05-06 to go from a YT video to an interactive slide deck app in minutes!

The pace at which Gemini 2.5 Pro is improving in code is wild! I generally leaned towards using Claude for code, but now I rely more on Gemini 2.5 Pro. It's just that good! Watch me use Gemini-2.5-Pro-05-06 to go from a YT video to an interactive slide deck app in minutes!

elvis

81,882 views • 1 year ago

Wow... Claude Code is is going to disrupt software... A $1B+ company Krea, released the best interface for Nano Banana, but it's WAY too expensive. So I cloned it in 25 minutes using Claude Code on . I filmed the whole thing (releasing soon) More info ↓

Wow... Claude Code is is going to disrupt software... A $1B+ company Krea, released the best interface for Nano Banana, but it's WAY too expensive. So I cloned it in 25 minutes using Claude Code on . I filmed the whole thing (releasing soon) More info ↓

Riley Brown

145,809 views • 8 months ago

Opus 4.6 vs Gemini 3 Pro (3/9) prompt: Build a premium interactive isometric 3D cozy room using Vite + React + Three.js (react-three-fiber/drei), with all objects modeled in code (no external assets) and subtle ambient animations. Gemini looks good on initial impression but I feel like I have way more to work with opus here (opus also did light/dark mode and took a quarter of the time to make it).

Opus 4.6 vs Gemini 3 Pro (3/9) prompt: Build a premium interactive isometric 3D cozy room using Vite + React + Three.js (react-three-fiber/drei), with all objects modeled in code (no external assets) and subtle ambient animations. Gemini looks good on initial impression but I feel like I have way more to work with opus here (opus also did light/dark mode and took a quarter of the time to make it).

Dev Ed

77,206 views • 6 months ago

Ossoff: Handing an out-of-control executive even more unfettered power just makes it even more vital that we restore checks and balances and constrain this president using our power as citizens, as voters in these midterm elections… I'm up against Donald Trump's hand-picked opponent, a bigot congressman who's only a congressman because his daddy was a congressman, but who has the full weight of Donald Trump and the white house behind him. An election denier and apologist for Jan six insurrectionists whose pro war pro tariffs and pro cutting your health care.

Ossoff: Handing an out-of-control executive even more unfettered power just makes it even more vital that we restore checks and balances and constrain this president using our power as citizens, as voters in these midterm elections… I'm up against Donald Trump's hand-picked opponent, a bigot congressman who's only a congressman because his daddy was a congressman, but who has the full weight of Donald Trump and the white house behind him. An election denier and apologist for Jan six insurrectionists whose pro war pro tariffs and pro cutting your health care.

Acyn

45,936 views • 2 months ago

It took me a week to get used to the new size of the iPhone 16 Pro. Now when I go back to my iPhone 15 Pro Max, it's a big, clunky phone. For the first three days, I thought I'd end up regretting switching to a smaller iPhone, but no, now I'm enjoying a lighter, more comfortable phone. And for a bigger screen, there's always an iPad, a foldable Android, or AR glasses.

It took me a week to get used to the new size of the iPhone 16 Pro. Now when I go back to my iPhone 15 Pro Max, it's a big, clunky phone. For the first three days, I thought I'd end up regretting switching to a smaller iPhone, but no, now I'm enjoying a lighter, more comfortable phone. And for a bigger screen, there's always an iPad, a foldable Android, or AR glasses.

Ben Geskin

250,827 views • 1 year ago

They told us this was the only way... but I stopped taking their word for it. As a doctor, I was taught to believe that shielding manufacturers from liability was the only way to ensure public health. But after digging into the history of the 1986 Act, I realized there’s a much more complicated reality beneath the surface.

They told us this was the only way... but I stopped taking their word for it. As a doctor, I was taught to believe that shielding manufacturers from liability was the only way to ensure public health. But after digging into the history of the 1986 Act, I realized there’s a much more complicated reality beneath the surface.

Mary Talley Bowden MD

12,409 views • 4 months ago