Introduction to Handible
Welcome to Handible, a powerful hand tracking and gesture control library for web applications. This library combines the power of MediaPipe's hand detection with Three.js to create immersive hand-based interactions.
What is Handible?
Handible is a JavaScript library that enables:
- Real-time hand tracking and gesture detection
- 3D interaction with virtual objects
- UI controls through hand gestures
- Multiple hand support
- Easy integration with Three.js scenes
🎬 Live Demo
Experience Handible in action! Check out our live demo at handible.vercel.app to see:
- 👋 Hand Detection - Real-time 21-point finger tracking
- 🎯 3D Object Control - Gesture-based manipulation
- 🎨 Surface Interaction - Virtual UI controls
Use your webcam to interact with 3D objects - no special hardware required!
Quick Navigation
- Getting Started - Set up your first Handible project
- Core Concepts - Learn about the fundamental features
- Advanced Features - Explore advanced capabilities
- API Reference - Detailed API documentation
Why Handible?
- 🎥 Webcam Only - No expensive sensors or special hardware
- ⚡ Real-time Performance - 60fps tracking with ~16ms latency
- 🎯 Precise Detection - 21 hand landmarks per hand
- 🔧 Easy Integration - Drop-in solution for Three.js projects
- 📱 Cross-platform - Works on desktop and mobile browsers
🌐 Browser Support
| Browser | Version | Support |
|---|---|---|
| Chrome | 88+ | ✅ Full support |
| Firefox | 85+ | ✅ Full support |
| Safari | 14+ | ✅ Full support |
| Edge | 88+ | ✅ Full support |
Requires WebGL2 and camera permissions
📊 Performance Specs
- Frame Rate: 60fps real-time tracking
- Latency: ~16ms input to response
- Hand Points: 21 landmarks per hand
- Max Hands: 2 simultaneous tracking
- Accuracy: 95%+ in good lighting