I built an interactive particle gravity simulation that reacts to real-time hand gestures — fully in the browser.
No game engine.
No plugins.
Just WebGL + Three.js + AI-based hand tracking.
You can literally turn your hand into a gravity well and control thousands of particles in real time.
🚀 Live Demo
👉 https://particle-gravity-fun.pages.dev/
💻 Source Code (Open Source)
👉 https://github.com/yogender-ai/Particle-Gravity-Fun
⭐ Feel free to star or fork if you find it interesting
✨ Features
~8,000 particles rendered in real time
Smooth 60 FPS particle swarming
Dynamic color physics (gesture-based color transitions)
Pinch gesture triggers high-energy “cosmic” effects
Runs entirely in the browser
🛠️ Tech Stack
Three.js (WebGL rendering)
JavaScript
AI Hand Tracking (MediaPipe)
WebAssembly (for performance-critical logic)
Cloudflare Pages (deployment)
🧠 Why I Built This
This started as a fun experiment to explore how far creative coding + AI + web graphics can go without heavy frameworks.
It’s exciting to see sci-fi-like interactions becoming possible directly on the web.
🙌 Feedback Welcome
I’m actively improving this project and experimenting with:
Better physics
More gesture types
Performance optimizations
Would love feedback from fellow developers 🙏
If you enjoyed it, please ⭐ the repo or share ideas.
🔖 Tags (important on dev.to)
Add these when publishing:
Top comments (1)
This is genuinely cool. Turning hand gestures into a gravity source feels playful but also technically solid, and getting this many particles running smoothly in the browser is no small thing. Nice example of how far creative coding with Three.js and WebGL can go today.