# Threejs Water with caustics underwater and droplets using react three fiber

> I’ve taken the threejs water realism to the next level! Now with RGB distortion in the caustics, we get even more realistic, colorful light projections. The…

Canonical page: https://andersonmancini.dev/videos/threejs-water-with-caustics-underwater-and-droplets-using

Published: 2024-11-04 · Duration: 2:49 · Category: Projects · Tags: three.js, react-three-fiber, post-processing

Watch: [YouTube](https://www.youtube.com/watch?v=iFHic23QiCo) · [Subscribe to the channel](https://www.youtube.com/@AndersonMancini?sub_confirmation=1)

Sign up for my newsletter:

I’ve taken the threejs water realism to the next level! Now with RGB distortion in the caustics, we get even more realistic, colorful light projections. The water movement has been improved to flow naturally, with optimizations for smoother performance.

Plus, I’ve added a post-processing effect that simulates underwater distortion, complete with a dynamic waterline when the camera is partially submerged. And when we come up for air, watch out for realistic water droplets on the screen!

Stay tuned for the live link coming soon!

## Links from the video

- [Live demo](https://andersonmancini.dev)

## Related projects

- [Realistic Water](https://andersonmancini.dev/projects/realistic-water.md) — WebGL pool simulation with caustics
