"A shinobi’s life is not measured by how they lived, but rather what they managed to accomplish."
JEETRICO Anime AR Engine is a browser-based Augmented Reality system that lets you summon anime chakra powers using real-time hand tracking and computer vision.
No apps.
No installation.
Just open the page and activate your chakra.
▶ Watch the Demo
https://github.com/jeetrico/anime-ar-engine/blob/main/demo.mp4
👉 CLICK HERE TO ACTIVATE YOUR CHAKRA
📱 Works best on modern mobile devices
The engine uses MediaPipe Hands to track 21 hand landmarks in real time.
Pipeline:
1️⃣ Camera captures the video feed
2️⃣ MediaPipe detects hand landmarks
3️⃣ Engine checks if palm is open
4️⃣ Jutsu VFX attaches to palm anchor
5️⃣ Chakra effect grows dynamically
When your right palm opens, the engine generates a rotating chakra sphere.
Features:
• Starts with swirling chakra core
• Mid-animation loop for smooth aura
• Dynamic chakra expansion
• Anchored slightly above the palm
Example logic:
if(handOpen){
rasenganSize += chakraPower
}The longer you hold the palm open, the bigger the Rasengan becomes.
Opening your left palm activates lightning chakra.
Features:
• Instant activation
• Continuous lightning animation
• Infinite looping effect
• Perfect palm-center alignment
Inspired by the legendary Raikiri technique.
When both hands activate simultaneously, the engine detects a chakra clash.
HUD warning:
⚠️ JUTSU CLASH DETECTED ⚠️
Future upgrades may include:
💥 Chakra explosion
⚡ Lightning discharge
🌪️ Energy shockwave
The system prevents animation glitches using state-tracking logic.
Example:
if (!wasOpen[idx]) {
vidRasengan.currentTime = 0;
vidRasengan.play();
}Core components:
| Component | Role |
|---|---|
| MediaPipe Hands | Hand landmark detection |
| Gesture Logic | Detect open / closed palm |
| Video VFX | Chakra animations |
| Canvas Renderer | Skeleton tracking |
| Technology | Purpose |
|---|---|
| HTML5 | UI structure |
| CSS3 | Chakra glow effects |
| JavaScript | Engine logic |
| MediaPipe Hands | Real-time hand tracking |
| Canvas API | Skeleton rendering |
| MP4 overlays | Anime chakra VFX |
anime-ar-engine
│
├── index.html
│ └── Core AR engine
│
├── demo.mp4
│
├── assets
│ ├── jeet_left_aura.mp4
│ └── jeet_right_aura.mp4
│
├── LICENSE
└── README.md
Clone the repository
git clone https://github.com/jeetrico/anime-ar-engine.git
Open the folder
cd anime-ar-engine
Run a local server
python -m http.server
Open browser
http://localhost:8000
For best tracking accuracy:
✔ good lighting
✔ clear background
✔ hand fully visible
Mobile cameras provide better tracking performance than most webcams.
Planned features:
• 💥 Chakra explosion system
• ⚡ Lightning particle engine
• 🎮 Gesture-based jutsu selection
• 🎥 AR recording feature
• 🧠 AI gesture recognition
• 🌀 Multiple anime abilities
Jeet Banerjee
GitHub
https://github.com/jeetrico
MIT License
You are free to:
✔ use
✔ modify
✔ distribute
If this project awakened your chakra:
⭐ Star the repository
🍴 Fork the project
🚀 Build your own anime AR powers
