Computer Vision Playground
Run browser-based vision workflows powered by MediaPipe. Use your webcam to detect hands, faces, body poses, segment images, and identify objects — all with real-time overlays, measurements, and interactive controls.
Hand Landmark Detection
Detect and track 21 hand landmarks in real time using your webcam. See finger joints, tips, and palm positions overlaid on the video feed. Explore gesture recognition, finger counting, and hand pose analysis.
Face Detection
Detect faces in images or webcam streams with bounding boxes and key facial landmarks. See detection confidence scores, face position, and explore how the model handles multiple faces, different angles, and lighting conditions.
Face Mesh
Visualize a dense 468-point facial mesh in real time. See the intricate triangulation of facial features, track expressions, and explore applications like AR filters, face morphing, and emotion detection.
Pose Landmark Detection
Track 33 body pose landmarks covering the full skeleton — from head to toes. Visualize joint positions, body angles, and skeletal connections in real time. Explore applications in fitness tracking, dance analysis, and motion capture.
Image Segmentation
Separate the foreground from the background pixel by pixel. See segmentation masks, apply background replacement effects, and understand how the model classifies each pixel into different semantic categories.
Object Detection
Detect and classify common objects in images or webcam feeds. See labeled bounding boxes with confidence scores, track multiple objects simultaneously, and explore how the model distinguishes between different object categories.
What You'll Learn
Landmark-Based Detection
Understand how models identify specific keypoints on hands, faces, and bodies to enable tracking and gesture recognition.
Real-Time Inference
See how MediaPipe achieves fast, browser-based inference without a server, running AI models directly on your device.
Segmentation & Detection
Learn the difference between pixel-wise segmentation and object-level detection, and when to use each approach.
Practical CV Applications
Explore real-world use cases including AR filters, fitness tracking, background removal, and autonomous systems.
Ready to See AI Vision in Action?
Start with Hand Landmark Detection — point your webcam and see 21 keypoints tracked on your hand in real time.
Launch Hand Landmarks