RYOIKI-TENKAI is a cursed technique visualizer based on the popular anime series, Jujutsu Kaisen 呪術廻戦. It combines the MediaPipe library with Three.js to recreate cursed techniques from Jujutsu Kaisen through hand gestures and particle systems. Now featuring 16 unique techniques and domain expansions!
Frontend
3D & ML
Tools & Platforms
- Node.js 14+
- Modern web browser with webcam support
- Webcam for gesture detection
src/components/: React components for visualization and hand trackingsrc/App.jsx: Main application container and state managementsrc/App.css: Global styles and animations
This is a client-side only application running entirely in the browser.
- Clone the repository:
git clone https://github.com/zuck30/RYOIKI-TENKAI.git cd RYOIKI-TENKAI - Install the required npm packages:
npm install
- Start the React development server:
npm run dev
- Open your browser and navigate to
http://localhost:5173
npm run buildThis project utilizes particles to render volume-based cursed techniques. Below are all 16 implemented techniques:
| Technique | Character | Trigger | Visual Effect |
|---|---|---|---|
| Hollow Purple | Gojo Satoru | Pinch gesture (Thumb + Index touching) | Chaotic singularity combining attraction and repulsion |
| Infinite Void | Gojo Satoru | Cross gesture (Index + Middle fingers crossed) | Multi-layered celestial domain with event horizon ring |
| Red | Gojo Satoru | Index finger pointing up | Blinding white-hot core with jagged sphere of repulsive force |
| Malevolent Shrine | Ryomen Sukuna | Flat hand / Prayer gesture | Dark, ominous aura representing the King of Curses |
| Technique | Character | Trigger | Visual Effect |
|---|---|---|---|
| Black Flash | Yuji Itadori | Closed fist punch | Concentric rings of black/red lightning with space-time distortion |
| Idle Transfiguration | Mahito | Wiggling fingers + grasping | Morphing soul particles that reshape and deform space |
| Boogie Woogie | Todo Aoi | Hand clap | Rapid teleportation flashes with purple energy swaps |
| Ten Shadows | Megumi Fushiguro | Shadow puppet gestures | Shadow beasts emerging from darkness (Nue, Mahoraga) |
| Disaster Flames | Jogo | Clawed hand reaching upward | Volcanic eruption with magma particles and heat distortion |
| Cursed Speech | Inumaki Toge | Hand over mouth then pointing | Sound wave kanji particles compelling action |
| Construction | Mai/Yorozu | Open palm gathering energy | Matter materialization from cursed energy particles |
| Comedy | Takaba | Laughter gesture + finger guns | Cartoon effects, question marks, absurd physics |
| Blood Manipulation | Choso/Kamo | Finger drawing motion | Crimson blood particles forming piercing blades |
| Ratio Technique | Nanami | Hand chopping with precise angle | Grid lines with 7:3 ratio division and golden ratio highlights |
| Jackpot | Hakari | Fist pump + victory pose | Pachinko lights, rolling numbers, golden sparks |
| Sky Manipulation | Uro | Sweeping arm motion | Glass-like space fracturing and bending |
CursedVisualizer.jsx: Handles Three.js scene and particle animations for all 16 techniquesHandTracker.jsx: Manages MediaPipe Hands initialization and detects 16 different gesturesUI.jsx: Renders the heads-up display showing current technique and character
- Instanced Meshes: Used for similar particles across techniques
- LOD System: Level of Detail adjustments for complex effects
- Resource Management: Proper disposal of Three.js resources
- Optimized Particle Counts: 500-2000 particles per technique for smooth performance
The modular architecture makes it easy to add more techniques:
- Add gesture detection logic in
HandTracker.jsx - Create particle effect in
CursedVisualizer.jsx - Add technique name to
UI.jsx - Test with webcam
- Mythical Beast Amber (Kashimo) - Lightning/plasma effects
- Granite Blast (Ryu) - Concentrated beam attacks
- Star Rage (Yuki) - Black hole/virtual mass
- Cursed Spirit Manipulation (Geto) - Spirit merging
- Heavenly Restriction (Toji) - Pure physical afterimages
This project is licensed under the MIT License, see the LICENSE.md file for details.
If you have any questions or issues, please open an issue on GitHub or contact the maintainer.
- Jujutsu Kaisen (Gege Akutami) for the incredible inspiration
- MediaPipe for hand tracking capabilities
- Three.js community for 3D rendering tools
- All contributors and testers who helped expand the technique library
"Gambare , Gambare" - Ryomen Sukuna
Made with 💜 for Jujutsu Kaisen fans